阅读 42

前端笔记(5月10-14日)

微信小程序,通过变量名的字符串,来获取变量并使用

注:偶然发现 不用像后面写得那么麻烦,let param = "isShow";

let param = "isShow";   

this.data[`${ param }`] // 直接写成  this.data[ param ]
复制代码

有一变量isShow,let param = "isShow"; 通过this.data[${ param }]可以获取到变量。 具体的例子:


data: {
  isShow:false
},
 
 
click:function(){
  console.log(this.data.isShow)
  this.switch_for_string("isShow")
  console.log("切换后:")
  console.log(this.data.isShow)
  console.log("")
},
 
// 切换变量值
switch_for_string: function (param) {
  // param是变量名的字符串,比如  param = "isShow"
  this.setData({
    [`${param}`]: !this.data[`${param}`]
  })

复制代码

微信原生input组件,输入时可以将使用失去焦点和点击完成两个事件一起使用。可以不使用bindinput 减少setData调用

for循环绑定item的点击事件

给有点击事件的组件添加一个 data-any 属性 any可以是任意数据类型。

怎么用wx.navigateTo传递对象类型的数据?

传递的时候用JSON.stringify()包起来,在接受页面用JSON.parse()再转换回来

    wx.navigateTo({
      url: `/pages/shipping_Add_address/shipping_Add_address?address=${JSON.stringify(item)}`,
    })
复制代码
  onLoad: function (options) {
    let address = JSON.parse(options.address)
  },
复制代码

使用CSS实现如下效果

msedge_tqmeEDubn9.png

    height: 326px;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,0), rgba(255,255,255,0),rgba(255,255,255,0), rgba(0,0,0,0.5)),url("https://whiteclouds.oss-cn-shanghai.aliyuncs.com/temp-live1.jpg");
    background-size: 326px;
复制代码

切换选项使用赋值,然后选项内判断

  <view class="content-box" wx:if="{{showType==='five'}}">
    <view wx:for="{{cardData}}">
      <m-favorite_live_card cardData="{{item}}"></m-favorite_live_card>
    </view>
复制代码

js判断对象为空

  • 通过 JSON 自带的 stringify() 方法来判断:

JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。

if (JSON.stringify(data) === '{}') {
    return false // 如果为空,返回false
}
return true // 如果不为空,则会执行到这一步,返回true
复制代码
文章分类
前端
文章标签