html - 在数字输入中添加 SVG

Question

我有一个数字输入表单字段。

<input type="number" name="" v-model.lazy="userResponse" placeholder="Enter value here" class="bg-white border-gray-300 border-2 text-gray-600 shadow-md px-6 py-4 rounded-lg my-2" :class="{ 'border-teal-500 border-2' : isCorrect }" :disabled="showFeedbackView">

它给了我这个：

只要 isCorrect 值为真，我想在值旁边添加一个 svg 复选标记图标。

有没有办法做到这一点？

标签： htmlcssformsvue.js

Answer 1

is-correct使用以下规则添加类：

.is-correct{
    background-image: url(/path/to/success.svg);
}

并像这样使用它：

:class="{ 'border-teal-500 border-2 is-correct' : isCorrect }"

我从github new repo page获得了答案