美文网首页Vue.js学习小程序
小程序组件之父子传值

小程序组件之父子传值

作者: 前端来入坑 | 来源:发表于2018-09-27 20:25 被阅读11次

子组件内容

wxml

<!-- 这是自定义组件的内部WXML结构 -->
<view class="inner">
  {{innerText}}
</view>

js

Component({
//接收父组件传来的值-----properties
  properties: {
    // 这里定义了innerText属性,属性值可以在组件使用时指定
    innerText: {
      type: String,//类型
      value: 'default value'//默认值
    }
  },
  data: {
    // 这里是一些组件内部数据
    someData: {}
  },
  methods: {
    // 这里是一个自定义方法
    customMethod: function () { }
  }
})

json---注意json内部不能有注释

{
  "component": true,
  "usingComponents": {}
}

父组件使用子组件

wxml

//父组件
<view>
  <!-- 以下是对一个自定义组件的引用 -->
  <my-component inner-text="Some tet"></my-component>
</view>

json

{
  "usingComponents": {
    "my-component": "/components/my-component"
  }
}

小白可以看这篇深入学习https://www.jianshu.com/p/ea830fe470fa

相关文章

网友评论

    本文标题:小程序组件之父子传值

    本文链接:https://www.haomeiwen.com/subject/asizgftx.html