Element: 组件"Dialog 对话框"的 close-on-click-modal / close-on-press-escape / show-close 均失效!

Created on 13 Mar 2017  ·  2Comments  ·  Source: ElemeFE/element

组件A 从组件B $on 一个布尔值, 根据布尔值弹出dialog:
template:

<template>

      <el-dialog title="自定义级别" v-model="isModifyDialog" close-on-click-modal="false" close-on-press-escape="false" show-close="false">
        <el-form :model="modifyDialogForm">
          <el-form-item label="限制1" :label-width="formLabelWidth">
            <el-tooltip class="item" effect="dark" content="限制1 < 限制2 " placement="bottom">
              <el-input v-model="modifyDialogForm.limit1" auto-complete="off"></el-input>
            </el-tooltip>
          </el-form-item>
          <el-form-item label="限制2" :label-width="formLabelWidth">
            <el-tooltip class="item" effect="dark" content="限制1 < 限制2 " placement="bottom">
              <el-input v-model="modifyDialogForm.limit2" auto-complete="off"></el-input>
            </el-tooltip>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="modifyDialogCancel">取 消</el-button>
          <el-button type="primary" @click="modifyDialogDetermine">确 定</el-button>
        </div>
      </el-dialog>

</template>

data:

data(){
    return {
        modifyDialogVisible: false
    }
}

computed:

computed: {

      isModifyDialog(){

        setSelectBus.$on('setSelectModifyDialog', function (arg) {
          if (this.modifyDialogVisible) {
            return false;
          }

          this.modifyDialogVisible = arg;
        }.bind(this));

        return this.modifyDialogVisible;
      }

 }

组件B $emit 一个值:

setSelectBus.$emit('setSelectModifyDialog', this.ifModifyConfirm); // ifModifyConfirm是个Boolean值, 在组件B中因事件驱动变成true, 并跨组件传值给组件A.

Most helpful comment

绑定布尔值的话,属性前面要加冒号。

All 2 comments

绑定布尔值的话,属性前面要加冒号。

@Leopoldthecoder 谢谢。也感谢把 issue 中内嵌代码的格式修正了,学习了,谢谢!另祝 Element 一周年生快!

Was this page helpful?
0 / 5 - 0 ratings