v-bind

最后更新于:2022-04-02 01:16:22

## v-bind指令 **缩写:** : **类型:** any (with argument) | Object (without argument) **参数:** attrOrProp (optional) **修饰符:** - .prop - 被用于绑定 DOM 属性。(what’s the difference?) - .camel - (2.1.0+) transform the kebab-case attribute name into camelCase. (supported since 2.1.0) - .sync (2.3.0+) 语法糖,会扩展成一个更新父组件绑定值的 v-on 侦听器。 **用法:** 动态地绑定一个或多个特性,或一个组件 prop 到表达式。 在绑定 class 或 style 特性时,支持其它类型的值,如数组或对象。可以通过下面的教程链接查看详情。 在绑定 prop 时,prop 必须在子组件中声明。可以用修饰符指定不同的绑定类型。 没有参数时,可以绑定到一个包含键值对的对象。注意此时 class 和 style 绑定不支持数组和对象。 >[info] 示例 ~~~
~~~ .camel 修饰符允许在使用 DOM 模板时将 v-bind 属性名称驼峰化,例如 SVG 的 viewBox 属性: ~~~ ~~~ 在使用字符串模板或通过 vue-loader/vueify 编译时,无需使用 .camel。 >[success]代码示例1 ~~~ ~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind1.html ---- >[success]代码示例2 ~~~
~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind2.html --- >[success]代码示例3 ~~~
文字……
~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind3.html ---- >[success]代码示例4 ~~~
文字……
~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind4.html --- >[success]代码示例5 ~~~
文字……
~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind5.html ---- >[success]代码示例6 ~~~
文字……
~~~ >[success]预览:https://ityanxi.github.io/Vue-tutorial/chapter04/09v-bind6.html
';