.wxs与.js相似,但有其自己的语法,并不和javascript一致
导出时语法与js基本一致
在name渲染到页面时才执行该方法
~~~
function sliceName(name) {
if (name) {
if (name.length > 6) {
return name.slice(0, 6) + "..."
} else {
return name
}
}
}
module.exports = {
sliceName: sliceName
}
~~~
在导入时有所不同,在引用时需要给module定义一个名字,被调用的方法均在该名下
~~~
<wxs src="../../../models/book.wxs" module="tools"></wxs>
<text>{{tools.sliceName(detail)}}</text>
~~~
注意事项:
* .wxs在使用时经常会在数据为渲染完成前开始调用,所以需要给其添加判定,只有所需要渲染的数据存在时才能调用里面的方法
- 小程序环境配置
- 1.生命周期
- 页面生命周期
- 组件生命周期
- 2.小程序组件
- 点击事件bindtap|catchtap
- swiper轮播
- wx:for循环
- 播放音乐
- map
- tabBar底部页面切换
- scroll-view可滚动视图区域。
- web-view装载显示网页
- priviewImage新页面预览照片
- chooseImage本地选择照片
- onReachBottom上拉刷新,加载等待条
- setStorage缓存
- showToast弹出提示框
- slot父组件wxml传递到子组件
- form表单
- 小程序.wxs,方法在.wxml调用
- 3.组件前身:模板、模板传参
- 4.自定义组件、组件传参|传wxss|wxml代码
- 5.小程序正则
- 6.小程序页面跳转
- 7.open-type 微信开放功能
- 实例
- 1.第一个实例 hello world
- 2.第二个实例豆瓣电影数据渲染
- 豆瓣1.0基本版
- 豆瓣2.0升级版
- 豆瓣3.0豪华版
- 3.第三个实例多接口在同一页面使用
- HTTP封装
- 基础报错提示,类式封装
- Promise回调,类式封装