Question

我有一个Modal.js组件：

const ModalComponent = Vue.component('modal-component', {
  template: `
  <v-dialog
    v-model="isModalOpen"
    persistent='isPersistent'
    width="300"
  >
    <slot name='loaderIndicator'></slot>
    <slot name='dialog'></slot>
  </v-dialog>
  `,
   props: {
     isModalOpen: {
       type: Boolean,
       required: true,
       default: function () {
         return false;
       }
     },
     isPersistent: {
       type: Boolean,
       default: function () {
         return this.$store.state.isLoading
       }
     }
  },
});

export default ModalComponent;

无论我尝试了什么-我都无法将persistent属性值设置为'false'。与props一起尝试过（如上面的代码，因为我希望该组件获取此prop），尝试将其直接设置为false，尝试以不同的方式传递prop（即isPersistent ='false'，isPersistent = false，：isPersistent = ...”-无效。

有什么办法可以改变它？还是具有此属性意味着此模式将永久存在，无论如何？如果是这种情况，我该如何动态添加此道具？

Answer 1

尝试以下代码：

template: `
    <v-dialog
        v-model="isModalOpen"
        :persistent='isPersistent'
        width="300"
    >
        <slot name='loaderIndicator'></slot>
        <slot name='dialog'></slot>
    </v-dialog>
`,

如何动态设置Veutify对话框组件的“持久”属性

1 个答案: