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. 准备MyBatis

    MyBatis下载:https://github.com/mybatis/mybatis-3/releases MyBatis文件目录: 中文参考文档:http://www.mybatis.org/m ...

  2. Linux基础命令---添加用户useradd

    useradd 创建新的系统用户,useradd指令只能以管理员的身份运行,创建的用户都在“/etc/passwd”文件中.当不加-D参数,useradd指令使用命令列来指定新帐号的设定值and使用系 ...

  3. Linux基础命令---显示文本look

    look 显示文件中以特定字符串开始的行.在look执行二进制搜索时,必须对文件中的行进行排序.如果未指定文件,则使用文件“/usr/share/dict/words“,只比较字母数字字符,忽略字母字 ...

  4. mac电脑使用,开发环境配置指南

    mac电脑使用,开发环境配置指南 前端工具链,mac下都很好用 用brew来装软件 用brew cask来装应用 Introduction · macOS Setup Guidehttp://sour ...

  5. POJ 3662 Telephone Lines (二分 + 最短路)

    Farmer John wants to set up a telephone line at his farm. Unfortunately, the phone company is uncoop ...

  6. Lonsdor K518ISE free update news on what makes and year can work

    Lonsdor K518ISE engineers recently tested a number of cars and verified working great, below are tes ...

  7. 关于字符串split一些用法

    split方法在大数据开发中的多用于日志解析及字段key值分割,最近需求中碰到一个问题在 无论怎么分割都会出现数组下标越界问题, 由于前台在sdk中多加了几个字段(测试数据很少,大多为空) ,需要我们 ...

  8. Introduction to the Standard Directory Layout

    Having a common directory layout would allow for users familiar with one Maven project to immediatel ...

  9. VMware Workstation Pro14安装

    1. 下载VMware Workstation Pro14,注意,这个链接支持win7 64及以上系统 2.  点击进入安装 3. 接受许可协议 4. 选择安装目录,是否选择增强型键盘驱动程序 5. ...

  10. Mysql 存储过程中使用多游标

    Mysql 存储过程中使用多游标 drop procedure IF EXISTS test_proc_1; create procedure test_proc_1() begin ; ) ; ) ...