脚本宝典收集整理的这篇文章主要介绍了微信小程序开发: 开发前准备工作,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
写在开始
本人资深后端码农一枚,近期项目需求,接触到了微信小程序,将学习过程整理成文分享给小伙伴们,由于是边学边整理难免有表述不对的地方,望大家及时指正,感谢。
微信群二维码 欢迎交流
申请账号
点击 https://mp.weixin.qq.com/wxop...,进入小程序注册页面并根据指引填写相关数据。
@H_777_11@下载开发工具
开发者工具下载地址,根据自己的操作系统下载对应的版本
hello world
登录 https://mp.weixin.qq.com,设置
-开发设置
中找到AppID:
运行已安装的微信开发者工具
,选择小程序项目
,填写上一步的AppID及目录等信息。
在项目目录下分别创建以下文件:
/app.json
{
"pages": [
"pages/index/index"
]
}
/pages/index/index.js
Page({
data: {
hello: "这里将显示Hello文字"
},
handleDisplayHello() {
this.setData({
hello: "Hello WeChat MiniPRogram"
})
}
})
/pages/index/index.wXMl
<@H_126_92@view class="container">
<view class="content">{{hello}}</view>
<button bindtap="handleDisplayHello">显示Hello</button>
</view>
/pages/index/index.wxss
.container {
display:flex;
flex-direction: column;
align-items: center;
}
.container .content{
margin: 50rpx;
color: #0000cc;
}
点击工具栏中的编译
按钮,在模拟器中可以预览到效果,点击小程序中显示Hello
按钮后即可预览Hello WeChat MiniProgram
,如图:
以上便是小程序开发的简单准备工作及HelloWorld的Demo实现,下一篇文章将对每个文件进行详细讲解。
下期预告
微信交流群
以上是脚本宝典为你收集整理的微信小程序开发: 开发前准备工作全部内容,希望文章能够帮你解决微信小程序开发: 开发前准备工作所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。