props定义属性并获取属性值

html

  <div id="app">
<!-- 注册一个全局逐渐 -->
<!-- 注意如果自定义的属性带-像下面这个h-hehe,
        在props里面就要写驼峰写法,还有反过来就不行,你比如自定义标签用驼峰写法就报错 -->
<!-- 可以不绑定属性,那就不用写v-bind了 -->
<register v-bind:h-hehe="haha"></register>
</div>

js

     var demoTmp ={
   // 注意只有data赋值的地方是属性值,这里两个都是hehe,自定义的属性,而不是属性值haha
   template:`<h2>{{message}}--{{hHehe}}</h2>`,
   props:["hHehe"],
   data:function(){
  return{
  message:"内部组件components"
  }
   }
}
var vm = new Vue({
el:"#app",
data:{
haha:"props定义属性并获取属性值"
},
components:{
'register':demoTmp
}
})

Component 组件props 属性设置的更多相关文章

  1. Vue2.0 【第二季】第7节 Component 组件 props 属性设置

    目录 Vue2.0 [第二季]第7节 Component 组件 props 属性设置 第7节 Component 组件 props 属性设置 一.定义属性并获取属性值 二.属性中带' - '的处理方式 ...

  2. Vue.js 源码分析(十三) 基础篇 组件 props属性详解

    父组件通过props属性向子组件传递数据,定义组件的时候可以定义一个props属性,值可以是一个字符串数组或一个对象. 例如: <!DOCTYPE html> <html lang= ...

  3. Android EditText组件drawableLeft属性设置的图片和hint设置的文字之间的距离

    有的时候,我们需要在文本框里放置icon图片,并且设置默认提示文字的时候,需要设置两者之间的间距,如下图: 这里想设置的就是之前的手机icon和”请输入手机号“之间的距离,则可是使用以下的方式: &l ...

  4. 组件通过props属性传值

    组件之间的传值 组件是一个单独功能模块的封装,有属于自己的data和methods,一个组件的 data 选项必须是一个函数 为什么必须是函数:因为只有当data是函数时,不同实例调用同一个组件时才会 ...

  5. 微信小程序template模板与component组件的区别和使用

    前言: 除了component,微信小程序中还有另一种组件化你的方式template模板,这两者之间的区别是,template主要是展示,方法则需要在调用的页面中定义.而component组件则有自己 ...

  6. React创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    创建组件的方法,组件的props属性.state属性的用法和特点,父子组件传值,兄弟组件传值 1.react组件 1.1.创建组件的方法 1.1.1.函数组件 定义一个组件最简单的方式是使用JavaS ...

  7. 创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    1.创建组件的方法   函数组件   class组件 1.1 函数组 无状态函数式组件形式上表现为一个只带有一个 `render()` 方法的组件类,通过函数形式或者 `ES6` 箭头 `functi ...

  8. 怎样在 Vue 的 component 组件中使用 props ?

    1. 在注册一个组件时, 添加一个 props 属性, 将需要添加的 props 作为数组的元素进行添加, 比如下面的例子中, 我们添加了一个变量 name , 他就是一个 props, 我们可以通过 ...

  9. vue组件之属性Props

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

随机推荐

  1. 禁用HTTP.sys,导致80端口被禁用和IIS服务无法启动解决办法

    由于端口被占用,使用 win+r 运行 cmd 输入netstat -ano 可以看到端口被PIF 4占用,可以找到对应的进程NT kernel& System 该进程是Http.sys,是h ...

  2. 面试题-JAVA算法题

    1.编写一个程序,输入n,求n!(用递归的方式实现). public static long fac(int n){ if(n<=0) return 0; else if(n==1) retur ...

  3. 转:C# 小数位数保留的方法集锦

    转载自:http://www.jb51.net/article/17010.htm 1. System.Globalization.NumberFormatInfo provider = new Sy ...

  4. css的优先级 和 权重

    之前写页面样式时,有时会遇到 用多条样式定义规则对同一个元素进行样式设置的时候,当时想到的就是  按css选择器的优先级来搞定这个问题,说实话当时也就只记得 内嵌样式 > id > cla ...

  5. HADOOP nutch java mysql

    下载Hadoop安装包 wget  http://apache.fayea.com/hadoop/common/hadoop-2.7.2/hadoop-2.7.2.tar.gz   java安装 wg ...

  6. linux内核的双链表list_head、散列表hlist_head

    一.双链表list_head 1.基本概念 linux内核提供的标准链表可用于将任何类型的数据结构彼此链接起来. 不是数据内嵌到链表中,而是把链表内嵌到数据对象中. 即:加入链表的数据结构必须包含一个 ...

  7. Python中*args和**kwargs 的简单使用

    # 在函数定义中使用*args和kwargs传递可变长参数. *args用作传递非命名键值可变长参数列表(位置参数); kwargs用作传递键值可变长参数列表# *args表示任何多个无名参数,它是一 ...

  8. winscp中使用sudo的方法

    用截图了解如何在 WinSCP 中使用 sudo. 首先你需要检查你尝试使用 WinSCP 连接的 sftp 服务器的二进制文件的位置.你可以使用以下命令检查 SFTP 服务器二进制文件位置: [ro ...

  9. Java中使用自定义类封装数组,添加类方法实现数据操作

    1.具体见注释 2.后续或有更新 public class MyArray { private long[] array; private int cnt; // 自定义数组类的元素个数 /** 使用 ...

  10. Linux中USB协议栈的框架简介

    文本旨在简单介绍一下Linux中USB协议栈的代码框架: 下图是USB协议栈相关数据结构的关系图: 下面结合上图看一下系统初始化的流程: 1.USB子系统初始化:\drivers\usb\core\u ...