微信小程序知识点
微信小程序知识体系总结如图
整个系统分为两块视图层(View)和逻辑层(App Service)
关键技术点包括:响应的数据绑定,组件,API。
学习小程序需要具有的技术基础有:原型,闭包,ECMAScript 6等知识点。
微信小程序开发常用知识点有哪些?
一.嵌套循环时候,最好重命名下list和index
如果是嵌套循环,很容易出现多个list和index,例如表视图一样,所以在小程序中可以重命名 list 和index 方法为:wx:for-index=重命名 wx:for-list="重命名"
<view>
重命名list和index:
<text class={{classname}} wx:for="{{array}}" wx:for-index="key" wx:for-item="value"> {{key}}--{{value}} </text>
</view>
二.小程序中用html、css
小程序中的选择器跟css的一样.
1:.class
2: #id
3: element
4:分组 element,element
5:伪类选择器 :after :before 注意这里加入在了元素之内的最后/最前
引入外部css文件的时候,只需像iOS中导入文件那样,在其css文件的开始写上 : @import "外部地址" 即可。
html中布局用div很多,但是在小程序中用view标签,文本用text。
如果想用html原有的元素,必须在wxss中定义元素的display:block不然无法应用,且html元素的id选择器是无法应用的。
三.导航栏标题
与iOS开发很相似,小程序的导航栏也可以全局设置一下,在公共文件app.json中设置了导航栏相关样式如下:
"window": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "小程序组件",
"navigationBarBackgroundColor": "#f8f8f8",
"backgroundColor": "#f8f8f8",
"backgroundTextStyle": "light",
"enablePullDownRefresh": "true"
}
这个地方是全局设置,如果想要在不同的页面设置各自的标题属性,只需要在该子级文件中设置