Vue 3 - 我可以避免在任何地方使用 .value 吗？

Question

我是 Vue 3 的新手，我很难理解组合的一些概念 API。我正在尝试将我正在使用的库从 vue 2 移植到 vue 3，并在父元素中将名为 layout 的反应式属性传递给子组件。

所以在父组件中，我将 layout 返回给子组件，如下所示：

setup(props){
    const layout = ref({'width': 10, ... })
    return {
        layout,
        ...
    }
}

问题是，为了从任何子组件访问 width 或 layout 中的任何其他反应值，我需要使用语法 layout.value.width。这是一个很大的问题，因为在整个项目中 layout 被 layout.width 引用，这意味着我需要在每个对 layout 的引用中添加一个 .value 并执行相同的操作对于我传递给我的子组件的所有其他反应变量。有什么方法可以避免这种情况，或者我只是没有从作文中得到一些重要的概念 api?

Answer 1

至少有两种方式：

是的。您可以在没有 .value 的情况下工作。你必须使用 vue experimental version

或

您可以创建一个 reactive 变量，例如：

<script setup>
import { reactive } from 'vue'

const layout = reactive({'width': 10, ... })
</script>

Vue 3 - 我可以避免在任何地方使用 .value 吗？

Vue 3 - can i avoid using .value everywhere?

javascript

vue.js