刚开始学习vue组件的时候经常被 props这个传值搞晕,做个笔记

Vue.component('item', {
template: '#item-template',
props: {
model: Object
}
}) var demo = new Vue({
el: '#demo',
data: {
treeData: data
}
})
<ul id="demo">
<item
class="item"
:model="treeData">
</item>
</ul>
props可以是字符串也可以是对象, 如果组件里面需要穿对象,我们调用的时候就可以使用 :model=object  model对应组件中props中的model,  object 对象必须是 父级 data中的一个对象属性

vue组件的props的更多相关文章

  1. Vue组件选项props

    前面的话 组件接受的选项大部分与Vue实例一样,而选项props是组件中非常重要的一个选项.在 Vue 中,父子组件的关系可以总结为 props down, events up.父组件通过 props ...

  2. 【转存】Vue组件选项props

    原帖地址 前面的话 组件接受的选项大部分与Vue实例一样,而选项props是组件中非常重要的一个选项.在 Vue 中,父子组件的关系可以总结为 props down, events up.父组件通过  ...

  3. Vue组件之props,$emit与$on以及slot分发

    组件实例之间的作用域是孤立存在,要让它们之间的信息互通,就必须采用组件的通信方式  props用于父组件向子组件传达信息 1.静态方式 eg: <body> <div id=&quo ...

  4. vue 组件属性props,特性驼峰命名,连接线使用

    网址:https://www.cnblogs.com/alasq/p/6363160.html 总结如下:vue的组件的props属性支持驼峰命名,不支持连接线命名,使用是用连接线进行赋值或者数据绑定 ...

  5. 第七十二篇:Vue组件的props

    好家伙, 1.组件的props props是组件的自定义属性,在封装通用组件的时候,合理的使用props可以极大的提高组件的复用性 来假设一下,如果我们需要两个组件分别显示不同的值 目录结构如下: H ...

  6. vue 组件开发 props 验证

    使用props 在Vue中父组件向子组件中传送数据是通过props实现的,一个简单的使用props的例子: <!DOCTYPE html> <html> <head> ...

  7. vue组件之属性Props

    组件的属性和事件 父子组件之间的通信 父子组件之间的通信就是 props down,events up,父组件通过 属性props向下传递数据给子组件,子组件通过 事件events 给父组件发送消息. ...

  8. vue组件最佳实践

    看了老外的一篇关于组件开发的建议(强烈建议阅读英文原版),感觉不错翻译一下加深理解. 这篇文章制定一个统一的规则来开发你的vue程序,以至于达到一下目的. 1.让开发者和开发团队更容易发现一些事情. ...

  9. Vue组件-组件的属性

    在html中使用元素,会有一些属性,如class,id,还可以绑定事件,自定义组件也是可以的.当在一个组件中,使用了其他自定义组件时,就会利用子组件的属性和事件来和父组件进行数据交流. 比如,子组件需 ...

随机推荐

  1. 剑指offer——53字符流中第一个只出现一次的字符

    题目描述 请实现一个函数用来找出字符流中第一个只出现一次的字符.例如,当从字符流中只读出前两个字符"go"时,第一个只出现一次的字符是"g".当从该字符流中读出 ...

  2. P3224 [HNOI2012]永无乡(平衡树合并)

    题目描述 永无乡包含 nn 座岛,编号从 11 到 nn ,每座岛都有自己的独一无二的重要度,按照重要度可以将这 nn 座岛排名,名次用 11 到 nn 来表示.某些岛之间由巨大的桥连接,通过桥可以从 ...

  3. JS设置浏览器缓存,以及常用函数整理

    //设置缓存 function set_cache(key,value){ if(key=='') return false; localStorage.setItem(key, value); } ...

  4. 微信app支付返回-1的问题

    我也是被坑就当留个纪念 前两天查了各种关于微信app支付返回-1的都是ERR_COMM 问题然后各种 验证最后还是误解 第三天去验证了一下微信开放平台发现了问题 appid 不在同一个开放平台 项目之 ...

  5. opencv2.4.9+vs2012安装配置

    需要下载并安装vs2012  http://pan.baidu.com/s/1qXP76CO     第一次启动会提示要求输入激活序列号,请输入:YKCW6-BPFPF-BT8C9-7DCTH-QXG ...

  6. v-bind和v-model的区别

    1:v-bind动态绑定指令,默认情况下标签自带属性的值是固定的,在为了能够动态的给这些属性添加值,可以使用v-bind:你要动态变化的值="表达式" 2:v-bind用于绑定属性 ...

  7. Eclipse导入Maven项目解决Build Path不能配置问题

    Eclipse Mars Release (4.5.0)导入Maven项目时,发现项目Build Path不能配置,如下图所示: 解决办法: 1修改Project Facets 项目右键---> ...

  8. rasa学习(domain.yml、nlu.md、stories.md)(一)

    一. 什么是rasa Rasa是一个用于自动文本和基于语音的对话的开源机器学习框架.了解消息,保持对话以及连接到消息传递通道和API Rasa分为Rasa core和 Rasa nlu两部分: Ras ...

  9. PHP FTP 常量

    常量 描述 PHP FTP_ASCII   3 FTP_TEXT   3 FTP_BINARY   3 FTP_IMAGE   3 FTP_TIMEOUT_SEC   3 FTP_AUTOSEEK   ...

  10. delphi 可以自定义边框的文本框TSkinNormalEdit思路(QQ2011风格)

    需求: QQ我的资料中基本资料窗体中的文本框: 正常状态下,文本框只有一条看起来只有一个像素的边框,边框的颜色从上到下由深到浅的渐变,当鼠标定位到该文本框时,其边框会变粗,而且边框的颜色加亮显示 如下 ...