<pre>
rpx 适配 大小
====================
var that = this
接口图片
图片 反斜杠 replace(/\\/g,’/’)
==================wxParse=====================================
解析 html 信息
微信可以 用 webview 但是 有限制
个人类型 和海外类型不能支持 琐碎又用
wxParse https://github.com/icindy/wxParse
把 下载的wxParse目录 复制下面了
在页面引入 wxparse
//在使用的View中引入WxParse模块
var WxParse = require(‘../../wxParse/wxParse.js’);
//在使用的Wxss中引入WxParse.css,可以在app.wxss
@import “/wxParse/wxParse.wxss”;
可以 app.wxss
一如
引入模板
var article = ‘<div>我是HTML代码</div>’;
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName绑定的数据名(必填)
* 2.type可以为html或者md(必填)
* 3.data为传入的具体数据(必填)
* 4.target为Page对象,一般为this(必填)
* 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选)
*/
var that = this;
WxParse.wxParse(‘article’, ‘html’, article, that, 5);
=============
// 引入模板
<import src=”你的路径/wxParse/wxParse.wxml”/>
//这里data中article为bindName
<template is=”wxParse” data=”{{wxParseData:article.nodes}}”/>
=========模块化=========================================
比如 要换 域名 怎么办 不能每个页 都要 换host
公共功能 封装 模块
utils config.js
var config = {
host:’http://baidu.com’
}
module.exports = config
其他页面
var config = require(‘../../config.js’)
==========全局===============
如果 app.js 写入方法
其他页面方法调用 可以
可以在其他页面 中写入
var app = getApp();
==========wxs===================
可以 模板里 调用自定义方法 那就用wxs
WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致
wxs 是隔离的 单独了 不能 到处调用
就是 smarty 的 自定义模板标签
建立 wxs 目录 tool.wxs
里面不能用 es6语法 只能 js 语法
=============微信小程序自定义组件===================
建立 components 建立组件br目录右击建立组件
在 某个页面 目录 下 该页面.json 加入
引入 br
{
“usingComponents”: {
‘br’: ‘../components/br/br’
}
}
在 该页面 的 wxml 里 加入 <br /> 就是 现实 组件的页面了 厉害
=============父子组件传值=====
title 不同传值 传给子组件 hearder
1.在hearder 组件目录 力度额 hearder.js properties 里加入title
title:String
2.在 父页面 <header title=”{{title}}”></header>
父页面 data 中 加入 title:’某某值’; 这样 就把 title 传递给了 header;
========子组调用父组件–父组件调用子组件=======
父给子传值
建立foot组件 加入 <slot></slot>
然后 某页面 加入.js 加入组件
软后页面 加入 <foot></foot>
然后 在 <foot><button>把button标签传给slot里了</button></foot>
—————–
父组件主动调用子组件 方法
<button >调用子组件方法</button>
1.定义一个ID <hearder id=’hh’></hearder>
2.用 this.selectComponents
var hh = this.selectComponents(‘#header’);
hh.run(); //父执行 子组件 的run的方法
————–
子组件调用父组件的方法 通过 triggerEvent
Component({
properties: {},
methods: {
onTap: function(){
var myEventDetail = {} // detail对象，提供给事件监听函数
var myEventOption = {} // 触发事件的选项
this.triggerEvent(‘myevent’, myEventDetail, myEventOption)
}
}
})
点击 子组件foot 按钮 触发父组件 run()
1. 父组件 有 user页面 run() 方法 bindfu = ‘getrun’
2. 底部组件 foot 子组件 触发 父组件的 run方法
bindtap = ‘getrun’
getrun(){
this.triggerEvent(‘fu’, “传给父组件的数据”)
}
=======================================
微信小程序 toast 组件 自己的玩的
============
scroll-view
设备 里 基础 getsystemInfo
<scroll-view scroll-y style=”height: 200px;” bindscrolltolower=”loadMore” >
<view class=”list”>
<view class=”item” wx:for=”{{list}}”>
{{item.title}}
</view>
</view>
</scroll-view>
1.
data:{
windowHeight:400,
page:1
list:[]
flag:true;
},
onload:function(){
var that = this;
wx.getSystemInfo({
success (res) {
that.setdata(
windowHeight:res.windowHeight
) ;
}
})
}
2. <scroll-view scroll-y style=”height: 200px;” bindscrolltolower=”loadMore” >
改 <scroll-view scroll-y style=”height:{{windowHeight}}px;” bindscrolltolower=”loadMore” >
loadMore(){
this.reqdata();
}
reqdata(){
aja请求成功–res-
url + page;
var that = this;
var list = that.data.list.concat(res.data.result)
var page = ++ that.page;
that.setdata(
page:page
list:list
) ;
——-
}
===bug 请求出现重复请求 要加 flag 开关
loadMore(){
if(this.data.flag){
this.reqdata();
}
}
reqdata(){
this.setdata({
flag:false;
})
aja请求成功–res-
url + page;
var that = this;
if(res.data.result.length <20){
var f= false;
}else{
var f= true;
}
var list = that.data.list.concat(res.data.result)
var page = ++ that.page;
that.setdata(
page:page
list:list
flag:f
) ;
——-
}
==========================================
cover-view 覆盖物 简化导航
icon 阿里图标
拍照
</pre>