小程序开发框架wepy

目前，小程序有两种主流开发框架：mpvue和wepy。既然wepy是腾讯自己开发的框架，那么让我们简单了解一下wepy。

wepy的功能主要是提高开发者的开发效率。它采用了类似于vue的代码编写风格。结合webwack提供的各种插件的使用，开发人员可以熟练地开始小程序开发。然而，在重新开发的过程中，wepy和vue有很多不同。

（如果您不熟悉VUE，请参阅以下链接了解VUE的用法。）

1.方法调用（用vue中的方法编写的方法可以直接用this调用，用wepy中的this调用的方法需要与方法编写在同一级别）

方法={

bindtap（）{

让rst＝this.commonFunc（）；

//做点什么

},

绑定输入（）{

让rst＝this.commonFunc（）；

//做点什么

},

}

//正确：通用自定义方法在方法对象外部声明，并等于方法

自定义函数（）{

返回“某物”；

}

2.创建组件模板（在vue中创建组件的方法与创建页面的方法相同，在wepy中创建组件必须使用wepy.component）

//纬纱页的穿法

导出默认类Index扩展了wepy。第｛｝页

//Wepy组件创建方法

导出默认类yearProgress扩展wepy。组件｛｝

3.事件处理函数对象events在vue中从未遇到过。它的主要功能是传递事件。这在父组件调用子组件的方法和子组件调用父组件的方法中是常见的。

这个。$发射（“some-event”，1，2，3，4）；

//事件对象中声明的函数是事件处理函数，用于侦听组件之间的通信和交互事件

事件={

“某些事件”：（p1、p2、p3、$event）=>{

console.log（`${this.$name}从${$event.source.$name}`接收${$event.name}`）；

}

};

4.配置页面配置对象对应于本机页面。json文件，类似于app.wpy中的配置。

//用于设置小程序的顶部标题文本

配置={

NavigationBarTitleText:“我的建筑代码”，

}

5.wepy中ajax请求的全局拦截器

这截距（“请求”{

//发出请求时的回调函数

配置（p）{

//将时间戳属性统一附加到所有请求请求中的OBJECT参数对象

p、 时间戳=+新日期（）；

安慰日志（'配置请求：'，p）；

//必须返回OBJECT参数对象，否则无法将请求发送到服务器

返回p；

},

//请求成功后的回调函数

成功（p）{

//这里可以处理接收到的响应数据对象

安慰log（'请求成功：'，p）；

//必须返回响应数据对象，否则后续无法处理响应数据

返回p；

},

//请求失败后的回调函数

失败（p）{

安慰日志（'请求失败：'，p）；

//必须返回响应数据对象，否则后续无法处理响应数据

返回p；

},

//请求完成时的回调函数（如果请求成功或失败，将执行该函数）

完成（p）{

安慰日志（'请求完成：'，p）；

}

});

6.注意页面跳转。如果页面跳转是小程序中的标签页，则应使用不同的页面跳转方法

//常规页面跳转方法

wx.导航到({

网址：url

})

//遇到标签时以这种方式跳转

wx.switchTab({

网址：url

})

7.对于数据同步，设置子组件props的twoWay:true以实现子组件数据绑定到父组件的效果。如果已经使用了sync修饰符，并且在子组件属性中添加了twoWay:true，则启用双向数据绑定。

：twoWayTitle=“parentTitle”><；/儿童>

数据={

parentTitle:'p-title'

};

//儿童.wpy

//数据双向绑定

双向标题：{

类型：字符串，

默认值：“无”，

双向：真

}

最后，还有一些小程序的视频课程。感兴趣的合作伙伴可以从我的百度网盘下载