vue(二)-父子组件语法

2018-06-24 01:55:39来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

语法:

子组件:

给子组件弄个名字,name。props用来声明从父组件传来的数据。其他html和css部分正常写。

父组件:

HTML部分:使用子组件name作为标签来显示子组件。:items=“item”,是将数据传给子组件。items是在子组件声明的,item是父组件中data返回的。

js部分:使用import 将子组件导入; 给父组件命名(在router中会用到),data中返回子组件声明需要的items数据。 components中写入子组件名字。

css部分:

建议使用scoped,使用的好处是:使用 scoped 后,父组件的样式将不会渗透到子组件中。不过一个子组件的根节点会同时受其父组件有作用域的 CSS 和子组件有作用域的 CSS 的影响。这样设计是为了让父组件可以从布局的角度出发,调整其子组件根元素的样式。更进一步scoped可以参考vue官网:https://vue-loader.vuejs.org/zh-cn/features/scoped-css.html

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:.3-浅析express源码之applicaiton模块(2)-app.render

下一篇:vue-cli 的项目 切换到Linux环境下遇到问题