Question

我想问一个v-bind动态对象的问题。当绑定是一个完全动态的对象时，如何使用操作表达式绑定属性？如何保持attr可见？谢谢！

<template>
    <component v-bind="dynamicAttrs"></component>
</template>

    export default {
        data(){
            return {
                someObject:{
                    a:{
                        b:10
                    }
                },
                // This dynamicAttrs object is dynamically defined and save into the mysql database by the secondary development user, 
                // will load it from mysql for component init. 
                // All the properties of this object are dynamic, that is, how many properties are there, and the name of the property is dynamic.
                dynamicAttrs:{  
                    someAttr1:123,
                    someAttr2:"someObject.a.b + 500"   // How does this object with operation expressions bind? How do I ensure that it gets updated responsively, so that component gets the update automatically when `someobject.a.b` updated
                }
            }
        }
    }

dynamicAttrs对象是动态定义的，并由辅助开发用户保存到mysql数据库中，并从mysql加载它以进行组件初始化。

带有操作表达式的对象如何绑定？我如何确保它得到响应式更新，以便该组件在someobject.a.b更新时自动获取更新

Answer 1

通常，您将为此使用计算属性：

computed: {
  dynamicAttrs () {
    return {
      someAttr1: 123,
      someAttr2: this.someObject.a.b + 500
    }
  }
}

如果someObject.a.b更新，则将重新计算计算出的属性并更新绑定。

如何在vue中使用v-bind绑定动态对象

1 个答案: