小编Mar*_*rek的帖子

我想在Vue中创建自己的复选框。我想使用fontawesome中的两个图标（锁定和解锁）。选中我的复选框后，图标应被锁定，否则将被解锁。

这是我的代码

<template>
   <div>
      <i @click="statusChanged()" v-if="!checked" class="fas fa-lock-open lock"></i>
      <i @click="statusChanged()" v-if="checked" class="fas fa-lock lock"></i>
   </div>
</template>
<script lang="ts">
import Vue from 'vue';
import { Prop } from 'vue/types/options';
export default Vue.extend({
    props: {
        checked: {
        type: Boolean as Prop<boolean>,
    },
},
methods: {
    statusChanged() {
        this.checked = !this.checked;
    },
},
});

我收到一个错误：

无法分配给“已检查”，因为它是常量或只读属性

您能协助解决这个问题吗？先感谢您

更新：

我比问题能够解决。解决方案与TommyF的建议非常相似。

解决方法如下：

<template>
<div>
    <i v-if="!checked" class="fas fa-lock-open lock" @click="statusChanged()"></i>
    <i v-if="checked" class="fas fa-lock lock" @click="statusChanged()"></i>
</div>
</template>
<script lang="ts">
import …