微信小程序> 小程序

小程序

浏览量:1348 时间: 来源:小仙女de成长

一直听说很简单,从来没学过。
嗯,我比较喜欢干货,直接用到的
是看视频学到的,视频地址为
https://study.163.com/course/courseLearn.htm?courseId=1003612035#/learn/video?lessonId=1004125800&courseId=1003612035

正文开始

pages文件夹是直接放页面的
小程序
恩,目录结构就是这样的,只要你新建一个模块,就会有对应的一个文件夹出来,里面有对应的4个文件,
当然是需要去根目录下面的app.json配置下的呢

 {   ”pages”:[  "pages/index/index",  "pages/logs/logs",  "pages/news/news"  ]}
切换:navigator url="../news.news"跳转到新闻页面/navigator
 text这里写文字/text placeholder-class  设置placeholder颜色  view类似于div/view input bindinput="这样就能绑定值了"/ 

button /button可以设置plain  就是没颜色的意思
size可以设置大小,比如mini
这个就是取消按钮
v-if="{{data.length==0}}"判断有没有数据的话,记得一定要加{{}},要不然不起作用,这个跟vue是有区别的

 控制是否隐藏显示 wx:if="{{bshow}}"   change(){ this.setDate({    bshow: !this.data.bshow })
循环数组,记得加key,也就是索引 wx:for="数组的名字" wx:key="{{index}}"{{item}}-{{index}}
 循环对象,记得加key,也就是索引  wx:for="对象的的名字" wx:key="{{index}}"{{item.name}}-{{item.age}}-{{index}}
添加事件bindtap(click) button bindtap="aaa" type="primary" size="mini"跳转新闻页面/button然后再对应的js里面写,**对了 这边的不能写alert()这种弹出事件,因为人家是wx啊,你那个alert是属于window的啊,**所以当然没用啦,这里推荐的是console.log()这种调试方式呢wx.navigateTo({    如下图(如果使用微信开发者工具开发的话,直接一回车,全部出来啦(给个大大的微笑))})

小程序

尽管说小程序跟vue很相似,但是并不是完全一样,比如vue赋值
this.aaa=‘1211’;这样页面的值就是1211了
但是如果在小程序要点击改变data里面的值,就必须下面格式this.setDate({ aaa:'111' +Date.now() 这样就能改变成功,这里的Date.now()就是跟随机时间啦 })

小程序里面有几个默认文件
app.js
app.json
app.wxss
先说说app.js吧  他里面有很多东西都是自动生成的,不过我们也可以自己去定义一些数据,然后其他pages页面去取得,怎么取呢?如下
小程序

app.json下面的名字是全局的,
每个模块下面都有对应的名字,那就是分别到对应的json里面去修改就行

模块化:

 导出模块:   module.exports.x = x;   export.x = x   module.exports = {}      使用:    let co = require(模块路径);

列子:
在utils新建个common.js
如:

function echoHello(user){
return "欢迎用户:KaTeX parse error: Expected 'EOF', got '}' at position 12: (user)回来" }̲ function echo…{user}已经退出,欢迎下次再来’;
}
①module.exports.echoHello = echoHello;
②exports.echoBye = echoBye;
其实①②导出方式是一样的,只不过①可以导出一堆,②只能导出一个
然后在你想写的js里面就可以直接拿过来用啦,
var com = require(’…/…/utils/common’);
welconState(){
this.setData({
msg:com.echoBye(‘Strive’);
})
}

这样就是调取到上面写的js方法啦

更改数据同步view:   this.setDate({  })附上老师写的![这里写图片描述](https://img-blog.csdn.net/20180830140911265?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyOTYzODQx/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)![这里写图片描述](https://img-blog.csdn.net/20180830140919674?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMyOTYzODQx/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70)

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎