微信小程序开发工具都有哪些
本文摘要
下载好微信小程序开发工具注册新建项目
下载好微信小程序开发工具注册新建项目
WXML类似html内容:
WXSS类似于CSS内容:
/*pages/mypage/mypage.wxss*/
.main{
height:700px;
background-color:aqua;
}
.div1{
/*小程序自带单位rpx把屏幕的宽度等比例分成750份*/
/*占满宽度直接写750rpx即可*/
/*rpx总体上的大小比px要小*/
width:750rpx;
height:100px;
background-color:pink;
}
.div2{
width:300rpx;
height:50px;
background-color:red;
}
JS内容:
//pages/mypage/mypage.js
Page({
/**
*页面的初始数据
*/
data:{
username:"张三"
},
fn1:function(){
console.log('fn1')
},
fn2:function(){
console.log('fn2')
},
handle:function(e){
/*解构赋值*/
let{currentTarget:{dataset:{msg}}}=e;
//console.log(msg)
/*想要设置值视图和数据双向绑定显示要使用tShopfas.setDate*/
tShopfas.setData({
username:"李四"
})
/*获取小程序里面的值要使用tShopfas.data.的方式*/
console.log(tShopfas.data.username)
},
dian:function(){
/*使用getApp获取全局数据*/
const{globalData:{name}}=getApp()
console.log(name)
},
/**
*生命周期函数--监听页面加载
*/
onLoad:function(options){
console.log(options)
},
/**
*生命周期函数--监听页面初次渲染完成
*/
onReady:function(){
console.log('监听页面初次渲染完成')
},
/**
*生命周期函数--监听页面显示
*/
/*onShow的执行顺序大于onReady*/
onShow:function(){
console.log('mypage监听页面显示')
},
/**
*生命周期函数--监听页面隐藏
*/
/*切换到聊天主页面退出小程序的时候执行*/
onHide:function(){
console.log('mypage监听页面隐藏')
},
/**
*生命周期函数--监听页面卸载
*/
onUnload:function(){
console.log('监听页面卸载')
},
/**
*页面相关事件处理函数--监听用户下拉动作
*/
/*需要在对应的json中加入enablePullDownRefresh:true*/
onPullDownRefresh:function(){
console.log('下拉刷新')
},
/**
*页面上拉触底事件的处理函数
*/
/*需要在对应的json中配置onReachBottomDistance:0
主页面y轴出现滚动条
onReachBottomDistance表示滚动条距离底部多少的时候触发*/
onReachBottom:function(){
console.log('上拉加载更多')
},
/**
*用户点击右上角分享
*/
onShareAppMessage:function(){
console.log('用户点击右上角分享')
}
})
注意事项:app.json以及app.wxss可修改头部大标题,另右上角详情和设置可以设置相关配置
相关文章
****更多行业产品开发方案,请关注 加速度JSUDO***
<以上资讯仅供参考,如果您需解决具体问题,建议您关注作者;如果有软件产品开发需求,可在线咨询加速度产品经理获取方案和报价>
加速度JSUDO是一家企业级数字化解决方案提供商,专注于软件开发、网络营销、数字化转型咨询及云计算服务。核心业务包括定制化ERP/CRM系统、快速应用开发、大数据分析及物联网(IoT)解决方案,助力企业提升效率与智能化水平。服务覆盖制造业、零售、物流等多行业,致力于通过技术创新推动客户数字化转型。










