vue.js报错,具体如下,求解答

具体错误如下:

vue.esm.js?65d7:434 [Vue warn]: Invalid prop: type check failed for prop "value". Expected Array, got String.

found in

---> <MtChecklist>
       <MtPopup>
         <Finish> at E:\Caqm\app\src\components\Finish.vue
           <App> at E:\Caqm\app\src\App.vue
             <Root>
             

代码如下:

<template>
    <div class="page-field">
        <CaqmHeader title='完工确认'/>
        
    <div class="main_content">
          <div class="page-part">
            <mt-field label="制作人员"  placeholder="请选择制作人" 
            type="text" @click.native="workerClick" v-model="workersIds">
            </mt-field>
      <mt-popup v-model="membersDisplay" position="bottom" class="mint-popup-4">
         <mt-checklist
                title="请选择工作班成员"
                align="left" 
                v-model="membersValue"
                :options="membersOptions" @change="membersChange">
           </mt-checklist>
        </mt-popup>
      </div>
     </div>
    </div>
</template>

<script>
    import CaqmHeader from '../components/common/CaqmHeader'
 
    export default {
      data(){
          return{
      membersDisplay : false,
      workersIds : "",
      membersValue : "",
      membersOptions:[],
      
     }
       },
      methods:{
   
   //制作人员点击事件
      workerClick() {
    
    },
    membersChange(){

    }
    
    },

    components: {
     CaqmHeader
      },
  
    }
</script>

<style scoped>
.button_right{
  position: absolute;
  right: 0;
}
.confirm_btn {
  position: absolute;
  bottom: 0;
  width: 100%;
}

.main_content{
  overflow: scroll;
  width: 100%;
  bottom: 56px;
}
.mint-popup-4{
    width: 100%;
}

</style>

回答:

type check failed for prop “value”. Expected Array, got String.

prop期待传入数组,传入的却是字符串。类型错误,大概这意思

回答:

目测这个错误,membersValue应该绑定数组,你绑定了字符串。只是从你的代码推断出来的,你用的是mint-ui吧,去官网看看demo不就行了么

回答:

membersValue: []

回答:

@Timmy 一楼正解。你看看你传入的数据类型。

回答:

prop “value” 期望接收一个数组,但是得到了一个字符串。
组件在定义prop的时候为它设定了期望的数据类型。
你需要检查一下membersValue的数据类型。

回答:

错误很明显,传入的值期望是array,你传入的是string,修改下类型就好,因为props如果设置了类型,会做类型验证

回答:

我也遇到这样的情况了,纠结了一个多小时,总结如下:

【结论】复选select:属性multiple 和 v-model是数组 必须同时具备!!

v-model不定义成数组 + 属性设置成multiple 不行、
v-model定义成数组 + 属性没设置成multiple 也不行!

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注