欢迎您光临深圳塔灯网络科技有限公司!
电话图标 余先生:13699882642

网站百科

为您解码网站建设的点点滴滴

微信小程序开发中遇到的问题及解决方式

发表日期:2019-10 文章编辑:小灯 浏览次数:1212

app.json

  • 不可添加数据 微信小程序中的每一个页面的【路径+页面名】都需要写在 app.json 的 pages 中,且 pages
    中的第一个页面是小程序的首页。(多页面的时候,通过更改这个顺序进行调试)

wx:for

  • 在组件上使用wx:for控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。
    默认数组的当前项的下标变量名默认为index,数组当前项的变量名默认为item

<view wx:for="{{array}}">
  {{index}}: {{item.message}}
</view>

<text>

行内元素。直接设置margin值无效,需要同时规定display:block

数据绑定之后的动态修改

在data中指定{{某数据}}的绑定对象后,并不能让这个绑定的数据随着绑上去的变量更改而更改。需要在出发数据修改的事件中,增加dataSet,才能修改这个绑定的数据。

<!-- This is our View -->
<view> Hello {{name}}! </view><button bindtap="changeName"> Click me! </button>

// This is our App Service.
// This is our data.
var helloData = {
  name: 'WeChat'
}

// Register a Page.
Page({
  data: helloData,
  changeName: function(e) {
  // sent data change to view
  this.setData({
  name: 'MINA'
  })
  }
})

表单提交及数据获取

在表单中绑定提交事件bindsubmit,在button中设置form-type为submit。通过e.detail.value.textarea即可获取输入的内容。
注意:wxml中,textarea的name值必须是textarea,不能更改,否则无法获取数据,也不会报错。

<!--textarea.wxml-->
<form bindsubmit="bindFormSubmit">
  <textarea placeholder="form 中的 textarea" name="textarea"/>
  <button form-type="submit"> 提交 </button>
</form>

//textarea.js
  bindFormSubmit: function(e) {
     console.log(e.detail.value.textarea)
  }

overflow:hidden

父层要设置position:relative,这个overflow的设置才会对设置了position:absolute的子层有效

动态修改CSS样式

将数据绑定在style参数中,可以通过data来控制参数。

<!--wxml-->
<view class="block p3" style="left:{{p3left}}rpx; top:{{p3top}}rpx; transform:scale({{scale}})">

//.js
Page({
  //初始化数据
  data:{
    p3left:600,
    p3top:10,
    scale:0.8
  }
})

本页内容由塔灯网络科技有限公司通过网络收集编辑所得,所有资料仅供用户学习参考,本站不拥有所有权,如您认为本网页中由涉嫌抄袭的内容,请及时与我们联系,并提供相关证据,工作人员会在5工作日内联系您,一经查实,本站立刻删除侵权内容。本文链接:http://www.dengtar.com/24461.html
相关小程序
 八年  行业经验

多一份参考,总有益处

联系深圳网站公司塔灯网络,免费获得网站建设方案及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

业务热线:余经理:13699882642

Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.