xsijisw21 2022-06-13 22:24 采纳率: 0%
浏览 1765

Prop being mutated: "placement"问题,如何解决?

问题遇到的现象和发生背景

使用 element 里面的 日期选择器报错 使用的是vue2

问题相关代码,请勿粘贴截图
<template>
      <CommonForm :form="operateForm" :formLabel="operateFormLabel"></CommonForm>
</template>

<script>
import CommonForm from "../CommonForm.vue";
export default {
  name: "Aside",
  components: {
    CommonForm,
  },
  data() {
    return {
      operateForm: {
        name: "",
        age: "",
        sex: "",
        birth: "",
        addr: "",
      },
      operateFormLabel: [
        {
          model: "name",
          label: "姓名",
          type: "input",
        },
        {
          model: "age",
          label: "年龄",
          type: "input",
        },
        {
          model: "sex",
          label: "性别",
          type: "select",
          opts: [
            {
              label: "男",
              value: 1,
            },
            {
              label: "女",
              value: 0,
            },
          ],
           },
        {
          model: "birth",
          label: "出生日期",
          type: "date",
        },
        {
          model: "addr",
          label: "地址",
          type: "input",
        },
      ],
    };
  },
};
</script>



<template>
  <el-form  label-width="100px" :model="myForm" :inline="true">
    <el-form-item
      v-for="item in myFormLabel"
      :key="item.label"
      :label="item.label"
    >
       <el-date-picker
                 v-if="item.type === 'date'"
                 type="date"
                 value-format="yyyy-MM-dd"
                 placeholder="选择日期"
                 v-model="myForm[item.label]"
            >
      </el-date-picker>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  name: "CommonForm",
  props: {
    form: Object,
    formLabel: Array,
  },
  data() {
    return {
      myForm: this.form,
      myFormLabel: this.formLabel,
    };
  },
 
};
</script>


运行结果及报错内容
[Vue warn]: 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: "placement"

found in

---> <ElDatePicker> at packages/date-picker/src/picker.vue
       <ElFormItem> at packages/form/src/form-item.vue
         <ElForm> at packages/form/src/form.vue
           <CommonForm> at src/components/CommonForm.vue
             <ElDialog> at packages/dialog/src/component.vue
               <Aside> at src/components/Aside/index.vue
                 <App> at src/App.vue
                   <Root>

我想要达到的结果

不报错误

  • 写回答

3条回答 默认 最新

  • qq_46628314 2022-06-14 10:29
    关注

    img


    这好像是elementui 官方的一个bug,我看有人说,退回到2.15.8就没有报错了,你可以试试
    https://github.com/ElemeFE/element/issues/21922

    评论 编辑记录

报告相同问题?

问题事件

  • 创建了问题 6月13日

悬赏问题

  • ¥15 有人知道怎么将自己的迁移策略布到edgecloudsim上使用吗?
  • ¥15 错误 LNK2001 无法解析的外部符号
  • ¥50 安装pyaudiokits失败
  • ¥15 计组这些题应该咋做呀
  • ¥60 更换迈创SOL6M4AE卡的时候,驱动要重新装才能使用,怎么解决?
  • ¥15 让node服务器有自动加载文件的功能
  • ¥15 jmeter脚本回放有的是对的有的是错的
  • ¥15 r语言蛋白组学相关问题
  • ¥15 Python时间序列如何拟合疏系数模型
  • ¥15 求学软件的前人们指明方向🥺