如何在Vue中声明SFC/Composition中的计算值

Question

我正在尝试在VueJs中使用computed字段。

以前它是可以实现的：

{
props: {
left: 5,
right: 100,
},
computed: {
width: () {return this.right.value - this.left.value};
}
}

但是有了新的SFC/Composition语法，我该怎么做呢？

<script setup>
defineProps({left: 5, right: 100});
defineComputed(  //??
)
</script>

我读过这个链接，但它没有解释：https://github.com/vuejs/rfcs/blob/master/active-rfcs/0040-script-setup.md

Answer 1

在新的设置语法中，使用computed创建一个计算属性：

import { computed } from 'vue'
const props = defineProps({left: 5, right: 100});
const width = computed(() => props.right - props.left);