<template>
   <div class="ratingselect">
     <div class="rating-type">
       <span class="block positive" @click="select(2,$event)" :class="{'active':selectType === 2}">{{desc.all}}<span class="count">47</span></span>
       <span class="block positive" @click="select(0,$event)" :class="{'active':selectType === 0}">{{desc.positive}}<span class="count">47</span></span>
       <span class="block negative" @click="select(1,$event)" :class="{'active':selectType === 1}">{{desc.negative}}<span class="count">47</span></span>
     </div>
     <div @click="toggleContent" class="switch" :class="{'on':onlyContent}">
       <span class="iconfont icon">&#xe63d;</span>
       <span class="text">只看有内容的评价</span>
     </div>
   </div>
</template>

<script type="text/ecmascript-6">
 // const positive = 0;
 // const negative = 1;
 // const all = 2;
   export default {
       props: {
         ratings: {
           type: Array,
           default () {
             return [];
           }
         },
         selectType: {
           type: Number,
           default: 2
         },
         onlyContent: {
           type: Boolean,
           default: false
         },
         desc: {
           type: Object,
           default () {
             return {
               all: '全部',
               positive: '满意',
               negative: '不满意'
             };
           }
         }
       },
       methods: {
         select (type, event) {
           if (!event._constructed) {
             return false;
           }
           this.selectType = type;
           this.$emit('ratingtype.select', type);
         },
         toggleContent (event) {
           if (!event._constructed) {
             return false;
           }
           this.onlyContent = !this.onlyContent;
         }
       }
   };
</script>

报错信息为：Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "selectType"