<span class="block positive" @click="select(2,$event)" :class="{'active':selectType===2}">{{desc.all}}<span class="count">{{ratings.length}}</span></span>
<div class="switch" @click="toggleContent" :class="{'on':onlyContent}">
    <span class="icon-check_circle"></span>
    <span class="text">只看有內容的評價</span>
  </div>
 

methods: {
    select (type, event) {
      if (!event._constructed) {
        return
      }
      this.$emit('select', type)
    },
    toggleContent (event) {
      if (!event._constructed) {
        return
      }
      this.$emit('toggle')
    }
  }

父元件程式碼：

<ratingselect @select="selectRating" @toggle="toggleContent" :select-type="selectType" :only-content="onlyContent" :desc="desc" :ratings="food.ratings"></ratingselect>
 

methods: {
  selectRating (type) {
      this.selectType = type
      this.$nextTick(() => {
        this.scroll.refresh()//實時更新better-scroll的高度，$nextTick非同步更新dom
      })
    },
    toggleContent () {
      this.onlyContent = !this.onlyContent
      this.$nextTick(() => {
        this.scroll.refresh()//實時更新better-scroll的高度，$nextTick非同步更新dom
      })
    }
}