微信小程序开发教程--从零开始

更新时间:2020-12-14 14:38:41点击次数:830次
<p>
App({
</p>
<p>
onLaunch:函数(){
</p>
<p>
控制台日志(“应用程序启动”)
</p>
<p>
},
</p>
<p>
onShow:函数(){
</p>
<p>
控制台.日志('应用程序显示')
</p>
<p>
},
</p>
<p>
onHide:函数(){
</p>
<p>
控制台日志(“应用隐藏”)
</p>
<p>
}
</p>
<p>
})
</p>
<p>
该应用编程接口解释如下
</p>
<p>
美化ActionBar
</p>
<p>
Json文件负责配置ActionBar颜色。我们只需要在其中添加以下代码,下图是参数描述!
</p>
<p>
粘贴_图像. png
</p>
<p>
粘贴_图像. png
</p>
<p>
{
</p>
<p>
window':{
</p>
<p>
navigation  BarbackgroundColor  ' : ' # BBdef  8 ',
</p>
<p>
导航工具栏文本' : '演示',
</p>
<p>
navigationBarTextStyle': '白色'
</p>
<p>
}
</p>
<p>
}
</p>
<p>
粘贴_图像. png
</p>
<p>
现在我们来看看ActionBar是不是长这样!好,让我们继续写我们的第一个界面
</p>
<p>
我们使用wxml和wxss文件来美化页面
</p>
<p>
为了简化程序代码结构,
</p>
<p>
我们的名字是佩奇
</p>
<p>
这里我们被称为索引
</p>
<p>
然后我们创建index.wxml文件,并在其中编写以下代码
</p>
<p>
你好
</p>
<p>
然后创建index.wxss文件,并在其中编写以下代码。窗口{
</p>
<p>
color=# 4995fa
</p>
<p>
}
</p>
<p>
然后我们创建index.js文件
</p>
<p>
在文件中输入以下代码(系统会提示您输入页面集成开发环境)
</p>
<p>
页面({
</p>
<p>
数据:{
</p>
<p>
//text:“这是一页”
</p>
<p>
},
</p>
<p>
onLoad:function(选项){
</p>
<p>
//页面初始化选项是页面跳转带来的参数
</p>
<p>
},
</p>
<p>
onReady:function(){
</p>
<p>
//页面渲染完成
</p>
<p>
},
</p>
<p>
onShow:function(){
</p>
<p>
//页面显示
</p>
<p>
},
</p>
<p>
onHide:function(){
</p>
<p>
//隐藏页面
</p>
<p>
},
</p>
<p>
onUnload:function(){
</p>
<p>
//页面关闭
</p>
<p>
}
</p>
<p>
})
</p>
<p>
该功能解释如下:
</p>
<p>
Json文件负责配置页面路径
</p>
<p>
因此,我们向其中添加了以下代码
</p>
<p>
index的意思其实是指index.js文件
</p>
<p>
这里需要注意的是,页面中的路径实际上指向js文件
</p>
<p>
如果一个目录中没有这个名字的js文件,就会报错!
</p>
<p>
第' :页[
</p>
<p>
'页数/索引/索引'
</p>
<p>
],
</p>
<p>
超级Hello  World
</p>
<p>
为了学习事件绑定以及如何更新页面上的数据,
</p>
<p>
让我们成为一个超级Hello  World,也就是我点一下文字,就可以制作了
</p>
<p>
它会变色!
</p>
<p>
绑定事件
</p>
<p>
让我们打开index.wxml,把里面的代码改成这样
</p>
<p>
你好
</p>
<p>
事实上,它是补充的
</p>
<p>
catchtap='click  '
</p>
<p>
这两个属性是什么意思?不用担心。我会一一解释
</p>
<p>
Catch代表非冒泡事件
</p>
<p>
点击代表点击事件
</p>
<p>
所以连接是一个非冒泡的点击事件
</p>
<p>
后面是什么声音
</p>
<p>
Click实际上只是一个变量名
</p>
<p>
我们需要在index.js中用这个名字绑定接收事件的函数
</p>
<p>
让我们打开index.js
</p>
<p>
然后添加以下功能
</p>
<p>
单击:function(){
</p>
<p>
Console.log('单击文本');
</p>
<p>
},添加后,代码很长,所以这个代码被添加在红色框中
</p>
<p>
粘贴_图像. png
</p>
<p>
所以实际上,click事件的回调函数是catchtap='click  '
</p>
<p>
点击后添加:function()
</p>
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息