在服务上使用 Vue 3 响应性是不是有意义？

Posted 2023-02-23

【中文标题】在服务上使用 Vue 3 响应性是不是有意义？

【英文标题】：Does it make sense using Vue 3 reactivity on a service?在服务上使用 Vue 3 响应性是否有意义？

【发布时间】：2021-11-05 03:57:24

【问题描述】：

我发现 PrimeVue 的 DataTable 代码 sn-p 使用了新的 Compositon API

<script>
import  ref, onMounted  from 'vue';
import ProductService from './service/ProductService';

export default 
    setup() 
        onMounted(() => 
            productService.value.getProductsSmall().then(data => products.value = data);
        )

        const products = ref();
        const productService = ref(new ProductService());
                               ^^^^^^^^^^^^^^^^^^^^^^^^^^    
        return  products, productService 
    

</script>

ref() ProductService 是否有意义？ 我想它没有。我错了吗？

【参考方案1】：

我相信你是对的，分配给ref 是不必要的。

我认为可能是为了与选项 API 保持一致而添加的：

import ProductService from './service/ProductService';

export default 
    data() 
        return 
            products: null
        
    ,
    productService: null,
    created() 
        this.productService = new ProductService();
    ,
    mounted() 
        this.productService.getProductsSmall().then(data => this.products = data);
    

但是，productService 不是 data 对象的一部分，因此它不是响应式的，并且因为它是一个不保持状态的服务，所以它不需要。