Component 组件props 属性设置

最新推荐文章于 2024-06-21 11:09:47 发布

weixin_34248487

最新推荐文章于 2024-06-21 11:09:47 发布

阅读量204

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/Model-Zachary/p/6941011.html

版权

本文介绍了Vue.js中Props的使用方法，包括如何定义属性及如何获取属性值，并通过实例展示了自定义属性的绑定过程及其在组件间的传递方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

props定义属性并获取属性值

html

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

     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
          }
       })