渲染函数的标签使用el-input组件无法输入

Z时代
2024-03-06
分类：IT

我想在elementui的notify组件的message属性里使用渲染函数自义定message的内容
代码和显示如下：

<template>
  <div>
    <el-button type="text" @click="open3()">点击打开 Message Box 03</el-button>
  </div>
</template>
<script>
export default {
  data () {
    return {
      userName: 'jack'
    }
  },
  methods: {
    open3 () {
      const h = this.$createElement
      const self = this
      this.$notify({
        title: '标题名称',
        duration: 0,
        message: h('div', [
          h('el-input', {
            props: {
              value: this.userName
            },
            nativeOn: {
              input: function (value) {
                self.userName = value
              }
            }
          }),
          h('p', this.userName)
        ])
      })
    }
  }
}
</script>