分类 技术相关 下的文章

假设一个nodes列表,想在点击节点的时候控制子节点的显示和隐藏,此时需要添加一个“显示内容”属性来控制。

核心代码如下:

this.$set(this.nodes[index],'showContent',result)

参考代码:

     controlDis(index){//通过index拿到当前值
        let result = false;
        if(!this.nodes[index].showContent){
          result = true;
        }
        this.$set(this.nodes[index],'showContent',result)
      }

经测试,新属性的值能立即控制页面的显示和隐藏。

mpvue 使用微信小程序组件scroll-view的方法

  1. <scroll-view :style="{'height': '300px'}"></scroll-view>要设置高度
  2. 举例:小程序原先方法是bindscrolltolower,在mpvue当中要写成@scrolltolower template

template 代码

<scroll-view  :style="{'height': '200px'}" :scroll-y="true" @scrolltolower="scrolltolower" @scroll="scroll" >
  <div :style="{'height': '200px','background-color':'red'}">tyuiolpo</div>
  <div class=""  :style="{'height': '200px','background-color':'red'}">测试测试
  </div><div class=""  :style="{'height': '200px','background-color':'red'}">测试内容内容</div>
</scroll-view>

methods 部分

methods: {
    scrolltolower(){
      console.log(7)
    },
    scroll(e) {
      console.log(6)
      console.log(e)
    }
 }

支持 Html、Markdown 转 Wxml 可视化

安装mpvue-wxparse

npm i mpvue-wxparse

使用

<template>
  <div>
    <wxParse :content="article" @preview="preview" @navigate="navigate" />
  </div>
</template>

<script>
import wxParse from 'mpvue-wxparse'

export default {
  components: {
    wxParse
  },
  data () {
    return {
      article: '<div>我是HTML代码</div>'
    }
  },
  methods: {
    preview(src, e) {
      // do something
    },
    navigate(href, e) {
      // do something
    }
  }
}
</script>

<style>
@import url("~mpvue-wxparse/src/wxParse.css");
</style>

00734-li6mbj9dysc.png

详见:
https://npm.taobao.org/package/mpvue-wxparse
github:https://github.com/F-loat/mpvue-wxParse

免责声明
本博客部分内容来自于互联网,不代表作者的观点和立场,如若侵犯到您的权益,请联系[email protected]。我们会在24小时内进行删除。