page与components之间传参

1.page向components传参

<!--components/container/index.wxml-->
<text>{{title}}</text>
<text>{{presontation}}</text>

// components/container/index.js    引用的数据类型，数据才能引用过去
properties: {
    title: String,
    presontation: String,
  }

//pages/index/index.js   数据
  data: {
    title: "吃饭睡觉打豆豆",
    presontation: "我爱编程 编程爱我"
  },
<!--pages/index/index.wxml    -->
<v-container title="{{title}}" presontation="{{presontation}}"></v-container>  

2.components向page传参

Componnets数据流向page (通过绑定事件和触发事件传递数据) (当然最简单的一种表现就是直接在组件中塞入数据,这里其实是说的事件触发)

//1.在组件的使用的地方(index.wxml)绑定事件函数 

bind:li="onLike"        //就是事件

//2.并在index.js 中写出具体方法: 
  onLike(e){
    console.log(e.detail)
  }
//3.在组件中触发事件(index.js): 在methods写:
    onLike(){
      var isLike = this.properties.isLike;
      var count = this.properties.count;
      if(isLike){
        this.setData({
          isLike:false,
          count:count-1
        })
      }else{
        this.setData({
          isLike:true,
          count:count+1
        })
      }
      let behavior = this.properties.isLike?"like":"like/cancel";
      this.triggerEvent("li", { behavior : behavior})
    }

3.companies 的js封装

//my-behavior.js
var common = Behavior({
  properties: {
    title: String,
    presontation: String,
  }
});
export {common}

//companies/
import {common} from "../my-behavior"
Component({
  // properties: {
  //   title: String,
  //  presontation: String,
  // },

 behaviors: [common],
  data: {
  },
  methods: {

  }
})

赏

谢谢你请我吃糖果