wx 参数传值

1: data-id
咱们能够给HTML元素添加自定义的data-*属性
example:
 
假设页面里有下面的元素存在:
<div id="myDiv" data-name="myDiv" data-id="myId"
       data-my-custom-key="This is the value"></div>
 
不久以前我向你们展现了很是有用的 classList API,它是一种HTML5里提供的原生的对页面元素的CSS类进行增、删改的接口,彻底能够替代jQuery里的那些CSS类操做方法。而另一个很是有用的API就是  element.dataset API,从火狐6和Chrome8起就开始对它有了支持。这个简单的API可以让用户get或setHTML页面元素上的data-*属性。下面咱们来看看它是如何使用的!
想必你们都知道,咱们能够给HTML元素添加自定义的data-*属性。你能够给这个属性起任何名字,但在使用element.dataset API时你须要主要如下一些规则:
  • element.dataset不可以直接拿来用,否者你会遇到报错提示
  • 用JavaScript里使用data-*属性名时,要把名称转变成驼峰式命名(Camel-Case)
  • 名称不能以xml打头 
  • 名称里不能有大写字母
假设页面里有下面的元素存在:
<div id="myDiv" data-name="myDiv" data-id="myId"
data-my-custom-key="This is the value"></div>
要想获取这个data-id属性,你的代码应该写成这样:
// Get the element
var element = document.getElementById("myDiv");

// Get the id
var id = element.dataset.id;
要想获取data-my-custom-key属性值,你的代码应该写成这样:
// Retrieves "data-my-custom-key"
var customKey = element.dataset.myCustomKey;
给自定义属性赋值的方法是这样的:
// Sets the value to something else
element.dataset.myCustomKey = "Some other value";

// Element would be:
// <div id="myDiv" data-name="myDiv" data-id="myId"
// data-my-custom-key="Some other value"></div>
若是一个自定义属性并不存在,但在程序中你给它赋值,它会自动建立:
// Set new data- attribute
element.dataset.mootoolsFtw = "true";

// Element would be:
// <div id="myDiv" data-name="myDiv" data-id="myId"
//data-my-custom-key="Some other value" data-mootools-ftw="true">
//</div>
 
也许你会认为data-*属性里能够存放对象,但事实上不行,dataset不会初始化这些对象。我不清楚dataset对长度的限制,但在里面存放大量的数据一定会是DOM变得臃肿不堪,很难调试。喜欢使用jQuery的朋友应该知道jQuery里也有相应的$.data()方法,没错,HTML5里的这个原生的dataset就是来替代它的,
 
使用方法:
 
1: 设置data-id
 <view class="block" bindtap="playTap" data-id="{{song.id}}">
2: 传值
 playTap:function(e) {
        const dataset = e.currentTarget.dataset;
        wx.navigateTo({
          url: '../play/index?id='+ dataset.id
        })
        console.log(dataset.id);
    }
3: 取值
 onLoad:function (param) {
    //页面初始化
        this.setData({
            currentId:param.id
        })
}
二 
 
设置id的方法标识来传值
1:设置 
<view bindtap=“playTap" id="{{song.id}}">
2:取值
经过e.currentTarget.id;获取设置的id值,并经过设置全局对象的方式来传递数值,
三 :
<navigator url="../movie/movie?id={{item.id}}" wx:for="{{movies}}">
onLoad (params){
        app.fetch(API.detail + params.id,(err,data) => {
            console.log(data);
            this.setData({
                title:data.title,
                movie:data,
                loading:false
            });
        })
    }, 
 
go_incollection : function (){
        wx.navigateTo({
          url: '../generalInfo/generalInfo?id=' + this.data.customId + '&name=' + this.data.choseName 
        })
    }
const conf = {
    data:{
    },
    onLoad:function (e) {
        console.log(e.id);
        console.log(e.name);
    }
};
Page(conf);
相关文章
相关标签/搜索