首页 > 其他 > 详细

vue组件的基本知识点

时间:2018-08-12 13:04:47      阅读:126      评论:0      收藏:0      [点我收藏+]

1. 组件中 is 的特性:

有些 HTML 元素,诸如 <ul><ol><table> 和 <select>,对于哪些元素可以出现在其内部是有严格限制的。而有些元素,诸如 <li><tr> 和 <option>,只能出现在其它某些特定的元素内部。

这会导致一些bug:

<table>
<row-item></row-item>
</table>


这个自定义组件 <row-item> 会被作为无效的内容提升到外部,并导致最终渲染结果出错。幸好这个特殊的 is 特性给了我们一个变通的办法:
<table>
<tr is="row-item"></tr>
</table>

需要注意的是如果我们从以下来源使用模板的话,这条限制是不存在的:
  • 字符串 (例如:template: ‘...‘)
  • 单文件组件(.vue)
  • <script type="text/x-template">

 2. 子组件中的data 是一个函数,返回值return是需要的数据

  Vue.component(‘counter‘,{
  template:‘<div @click="handleClick">{{number}}</div>‘,
  data(){
    return{
      number: 0
    }
  }

 

3. ref引用,作用是操纵dom节点

用法:<div ref=" one "></div>

获取整个div: this.$refs.one      /*  $refs指的是所有的ref   */

 

vue组件的基本知识点

原文:https://www.cnblogs.com/ly2646/p/9462369.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!