首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何使自定义$option扩展计算或方法功能vue

如何使自定义$option扩展计算或方法功能vue
EN

Stack Overflow用户
提问于 2018-08-02 09:31:36
回答 1查看 497关注 0票数 0

当我构建一个组件时,有时,计算的属性变得非常大,很难读懂。

例如,当我有一个使用10个字段(输入、选择等)处理表单的组件时,我通常会创建10个计算属性来检查相应表单字段的验证。10个通过v模型监视变化的计算属性,等等。

我想要的是,如果有人知道创建自定义属性和扩展计算功能的方法

例如:

代码语言:javascript
运行
复制
<template>
   <div>
       <input class="form-control" v-model="$options.vmodels.firstName">
   </div>
</template>

和剧本部分

代码语言:javascript
运行
复制
export default {
   name: 'ComponentA',  
   computed: {},
   vmodels: {
      firstName:{
        get(){ return store.state.firstName}, // lets assume this works
        set(value){store.state.firstName = value}
     }
   },
   methods: {},
   watch: {},
}

我试图使用$options来调用自定义属性,但它似乎不适用于计算功能。

例如,如果我想用get/set创建一个计算出来的自定义属性,并将它传递给v-模型,那么它将永远不会发生突变来触发set或get方法。

我希望这样做的主要原因是增加了代码的可读性。是的,我知道你们中的许多人应该说,如果组件变得非常大,我应该创建多个组件,但是我仍然想知道上面的方法是否有效。

提前感谢!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-08-03 09:08:02

我理解的是,您希望继承要在ComponentA中使用的一些属性。这正是Vue Mixins的用法。您可以按照您一直使用的计算属性为表单的字段创建另一个混合文件,并将该混合文件添加到ComponentA中。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51650177

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档