支付宝小程序组件化开发与Vue组件化开发对比_vuex 转支付宝小程序组件

一、支付宝小程序组件化开发

1.最外层新建文件夹components

 2.在components文件夹的右击菜单中,选择新建小程序组件,输入组件名,会自动生成自定义组件所需要的几个文件。

 3.组件配置文件 zujan.json 用于声明当前目录是个自定义组件。 

 4.组件注册 index.js 用于注册一个组件对象。

Component({
  mixins: [], // mixins 方便复用代码
  data: { x: 1 }, // 组件内部数据
  props: { y: 1 }, // 可给外部传入的属性添加默认值
  didMount(){}, // 生命周期函数
  didUpdate(){},
  didUnmount(){},
  methods: {   // 自定义方法
    handleTap() {
      this.setData({ x: this.data.x + 1}); // 可使用 setData 改变内部属性
    }, 
  },
})

5.在需要引入的父组件的 index.json中配置子组件的名称和路径

{
  "usingComponents":{"my-zujian" : "/components/zujan/zujan"}
}

 6.在父组件的页面中引用子组件

二、Vue组件化开发

1.src内新建components文件夹 ,新建第一个组件文件夹，新建组件页面

2.在父组件中引入使用