收藏
回答

wxml渲染数组 数组删除元素 wxml显示错误

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug input 微信iOS客户端 3.0.0.47 1.0.3
<block wx:for="{{labels}}" wx:key="{{index}}">
  <input  maxlength="{{maxlength}}" placeholder="{{placeholder}}" placeholder-class="fontsize-20 font-color"
class="orange font-color" data-index="{{index}}"  bindinput="input"/>
</block>

 data:{
    saying:"",
    labels:[""//输入标签 最多8个
  },
mmethods:{
  input:function(e){
      let labels=this.data.labels
      const  label=lrtrim(e.detail.value) //用户输入的label
      const index=e.currentTarget.dataset.index //label的索引
      


      if(label==""){
        console.log(`删除索引${index}`)
        console.log(`删除前:${labels}`)
        labels.splice(index,1)
        console.log(`删除后:${labels}`)
      }else{
        console.log(`增加索引${index}`)
        console.log(`增加前:${labels}`)
        labels[index]=label
        console.log(`增加后:${labels}`)
      }
      if(!labels.includes('')&&labels.length!=8){
        labels.push('')
      }
        this.setData({
          labels:labels
        })
      return label
    }
}

bug截图:


wxml渲染数组元素不对

回答关注问题邀请回答
收藏

3 个回答

  • 金煜峰
    金煜峰
    01-15

    input 里加上 value="{{item}}"

    01-15
    有用
    回复
  • ghost
    ghost
    01-15

    补充:截图是数组渲染后的结果。数组值是1,3,4,5,7,''。渲染结果明显不对。我试了多次

    01-15
    有用
    回复 1
    • ghost
      ghost
      01-15
      度娘上类似的问题不少 数组删除元素渲染错误 这样的问题怎么会悬而未决呢?还是我写的有问题?
      01-15
      回复
  • จุ๊บ
    จุ๊บ
    01-15

    从你打印来看,没啥毛病啊,删除的是索引是4 ,应该是 把 6 删了啊 有啥问题?

    01-15
    有用
    回复 9
    • ghost
      ghost
      01-15
      删除的是索引4 应该把6删除才对   删除后的数组是1,3,4,5,7,'' 截图是渲染的结果 你看 明显是不对的
      01-15
      回复
    • จุ๊บ
      จุ๊บ
      01-15回复ghost
      个人建议,你将this 的指向 重新定义试下
      01-15
      回复
    • ghost
      ghost
      01-15
      一样的 我试过了
      01-15
      回复
    • ghost
      ghost
      01-15
      度娘上类似的问题是2019年7月的 现在都21年1月了
      01-15
      回复
    • ghost
      ghost
      01-15
      数组删除视图渲染错误 感觉都没vue方便 vue也存在类似的问题 但至少解决了 还有什么数组元素双向绑定的  用小程序原生语言开发费劲
      01-15
      回复
    查看更多(4)
登录 后发表内容
问题标签