Vue计算不更新

Question

我有一个我想使用的计算函数，但我一直收到“计算属性已分配给但它没有 setter”。我只是想删除所有正斜杠和末尾的 'SYG'：99/KRFS/010572//SYG 当它粘贴到 v-model 输入中以实现此目的时：99KRFS010572.

这是我的设置函数

<input v-model="policyMapName" />
policy-map <span>{{ policyMapName }}</span>

setup() {
    const circuitID = ref('99/KRFS/010572//SYG');

    const policyMapName = computed(() => {
        const cID = circuitID.value;

        return cID.replace(/[/]/g, '').slice(0, -3);
    });
}

Answer 1

您应该将 setter 添加到您的 computed 属性和 getter :


<input v-model="policyMapName" />
policy-map <span>{{ policyMapName }}</span>

setup() {
    const circuitID = ref('99/KRFS/010572//SYG');

    const policyMapName = computed({
      get: () => {
        const cID = circuitID.value;

        return cID.replace(/[/]/g, '').slice(0, -3);
     },
    set:(newval)=>{
        circuitID.value =newval
    }   
 });
}

Vue计算不更新

Vue Computed Not Updating

vue.js

vuejs3

vue-composition-api