vue实际应用----props的默认数据，methods与computed

1.子组件props的写法

 如果默认porps的为对象

  props：{

     xxobj:{

              type:Object,

           default:()=>{

                  return{

                }

          }

    }

}

如果默认props的为数组

props：{

    xxx:{

        type:Array,

       default:()=>[

          {}

       ]

   }

}

computed的用法：

    类型：{ [key: string]: Function | { get: Function, set: Function } } 

  即computed：{

            xx(){／／这个xx属性是只读属性

                       逻辑处理

                    2.return  result

                  } ，

             

     yy: {／／这个属性可读写
      get: function () {
        return this.a + 1
      },
      set: function (v) {／／vm.yy=3;则vm.a=2
        this.a = v - 1
      }
    }

   }

 

computed和methods

<p>{{formatvalue(val)}}</p>

computed:{／／需要经常计算 有缓存的场景

    formatvalue(){

      return  function(value){

              let   aa=Number(value);

             let    bb='';

           switch(aa){

           case 1:

                  bb="很好"     ；

                 break；    

                 。。。

              default：

             bb=‘’

           }

         return  bb   ／／可以把上面逻辑放在一个方法里面

        }

    }     

}

method:{

     formatvalue(val){

       let   vals=Number(val)

    switch(vals){

       case 1:

           return "很好"

        。。。。。

       default：

       return  ‘’

       }

    }

}