wepy框架学习

第一步：全局安装wepy

npm install wepy-cli -g

第二步：生成开发项目

wepy init standard myproject

第三步：终端进入项目后，安装依赖

npm  install

第四步：启动项目

wepy build --watch

获取用户信息：

    <button class="confirm" open-type="getUserInfo" bindgetuserinfo="userInfoDidUpdated" @tap="confimAction">这里是需要用户点击触发授权才可以</button>
<script>
import wepy from 'wepy'
export default class cover extends wepy.component {
  config = {}
  components = {}
  data = { }
  computed = {}
  methods = {
    userInfoDidUpdated(e) {
      //这里可以获取到用户信息
      console.log(e)
      wx.setStorageSync('userInfo', e.detail.userInfo)//这里是讲用户信息存在缓存中
    },
    confimAction() {
      this.isShow = false
    }
  }
  events = {}
  onLoad() {}
}
</script>

父子组件的双向绑定数据：
1、父组件向子组件传值：
同vue写法一样，在父组件中引用子组件时，标签内写:child="child"
2、子组件向父组件中传值与vue有所不同的是，vue需要有点击事件触发才能将子组件的值传至父组件，wepy则可以实现父子组件的双向绑定数据，只要在props里面写上twoWay:true即可。

3、 image.png

//父组件中
<template>
  <view>
    <cover :flag="flag"></cover>
  </view>
</template>
//子组件中使用props接收
<script>
import wepy from 'wepy'
export default class cover extends wepy.component {
  props = {
    flag: {
      type: String,
      default: 'nothing',
      twoWay: true
    }
  }
  config = {}
  components = {}
  data = {}
  computed = {}
  methods = {}
  events = {}
  onLoad() { }
}
</script>