Javascript Vue.js-如何使用三元运算符在Vue中返回带有字体图标的html

我在vue中有以下内容：

      <div class="pt-2">
        <button
          class="bg-gradient-to-r from-green-100 to-blue-100 rounded p-3 w-full text-xl font-medium focus:outline-none"
          @click="isLoading = true"
          :disabled="isLoading"
        >
          {{isLoading ? '<i class="fas fa-circle-notch fa-spin"></i>' :
          'Register'}}
        </button>
      </div>

{{正在加载？''：
'寄存器'}}

我如何让它返回图标而不是显示：

---

您应该使用

v-if

指令使用条件呈现：

   <div class="pt-2">
        <button
          class="bg-gradient-to-r from-green-100 to-blue-100 rounded p-3 w-full text-xl font-medium focus:outline-none"
          @click="isLoading = true"
          :disabled="isLoading"
        >
          <i v-if="isLoading" class="fas fa-circle-notch fa-spin"></i>
          <span v-else >Register</span
        </button>
      </div>

登记