小程序开发小技巧

如何去掉button的边框？

wxml

<button>点击</button>

wxss

button:after {
  border: none;
}

参数传值的方法

data-id

我们可以给HTML元素添加data-*属性来传递我们需要的值,使用方法说明:

<button bindtap='ontap' data-id='100'>data传值</button>

取值

ontap: function(e) {
    const dataset = e.currentTarget.dataset
    console.log(dataset.id)
}

//运行结果：
100

data-注意事项：data-名称不能有大写字母,曾经我就因为大写了一个字母,找了半天的才发现这个错误..data-*属性中不可以存放对象

设置id 的方法标识来传值

设置id

<button bindtap='ontap' id='200' data-id='100'>id标示传值</button>

取值

ontap: function(e) {
    console.log(e.currentTarget.id)
}

//运行结果：
200

将所有的接口放在统一的js文件中并导出

比如在根目录下新建urls.js内容如下

const host = "https://192.168.1.11/api"
const paths = {
    login: `${host}/login`
    //...
}
module.exports = { host, paths}

使用

//引入urls.js
const urls = require('../../urls.js')

onLoad: function () {
    console.log(urls.paths.login);
}

//运行结果
https://192.168.1.11/api/login

使用模板(发现模板真是个好东西哦!)

定义模板:name设置模板的名字

<template name="cell">
    <view class="item"></view>
</template>

使用模板

//首先引入模板
<import src="../../template/cell.wxml" />

//然后使用模板后写模板的name..通过data来传递需要是数据
<template is="cell" data="{{item}}"></template>

Array比较好用的属性和方法

Array.isArray() 方法用来判断某个值是否为Array。如果是，则返回 true，否则返回 false。

//[] 表示一个空数组  {}表示一个空对象
console.log(Array.isArray([]));
console.log(Array.isArray({}));

//运行结果
true
false

concat() 方法将传入的数组或非数组值与原数组合并,组成一个新的数组并返回. （该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。）

var arr = [1,2,3];
console.log(arr.concat(4,5,[7,8]));

//运行结果
[1, 2, 3, 4, 5, 7, 8]

forEach() 方法对数组的每个元素执行一次提供的函数(回调函数)。

var arr = [1,2,3];
arr.forEach(function(value,index, array) {
    console.log(`value:${value},index:${index},array:${array}`);
});

//运行结果
value:1,index:0,array:1,2,3
value:2,index:1,array:1,2,3
value:3,index:2,array:1,2,3

join() 方法将数组中的所有元素连接成一个字符串。

let arr = ["mike","joson","bobal"]
console.log(arr.join('&'))

//运行结果
mike&joson&bobal

map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组

let arr = [{ "id": 1, "name": "mike" }, { "id": 2, "name": "joson" }];
let newArr = arr.map(function(item) {
    return item["id"];
});
console.log(newArr);

//运行结果
[1,2]

对象Object常用方法

var obj = [];
var obj = new obj();
var obj = Object.create(null);

添加元素的方法

dic["key"] = "value"

删除key的方法

delete dic["key"]

清空词所有条目

dic.clear()

删除

delete dic

查看所有属性的方法

Object.keys(obj)

对象的所有键名都是字符串，所以加不加引号都可以,如果键名是数值,会被自动转为字符串但是，如果键名不符合标识名的条件（比如第一个字符为数字，或者含有空格或运算符），也不是数字，则必须加上引号，否则会报错

读取属性

obj.name || obj['name']

注意: 数值键名不能使用点运算符（因为会被当成小数点），只能使用方括号运算符。

检查变量是否声明

if(obj.name) || if(obj['name'])

in 运算符用于检查对象是否包含某个属性,如果包含返回true,否则返回false

if ( 'x' in obj) {return 1}

with 语句

作用: 操作同一个对象的多个属性时,提供一些书写的方便

with(obj) {
    name1 = 1;
    name2 = 2;
}

//等同于
obj.name1 = 1;
obj.name2 = 2;

以上就是本文的全部内容，希望对大家的学习有所帮助