父组件传子组件参数限制String类型

 

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41

<template>   <div class="tab-bar-item" @click="itemClick">     <div v-if="!isActive"><slot name="item-icon"></slot></div>     <div v-else><slot name="item-icon-active"></slot></div>     <div :class="{active: isActive}"><slot name="item-text"></slot></div>   </div> </template>   <script> export default {     name: "TabBarItem",     props:{       path: String     },     data(){         return{             isActive: false         }     },     methods: {       itemClick(index){         this.$router.push(this.path).catch(err => {});       }     } } </script>   <style> .tab-bar-item{   flex: 1;   text-align: center;   height: 49px; } .tab-bar-item img{     width: 20px;     height: 20px; } .active{     color: red; } </style>