iView Modal 如何实现自定义 Form表单

Question

脚手架用的vue-cli，我现在需要点击按钮弹出来一个iView Modal 需要是一个表单，但是官网 实例只有点击弹出一个input

this.$Modal.confirm({
    render: (h) => {
      return h('Input', {
        props: {
          autofocus: false,
          placeholder: '数据名称'
        },
        on: {
          input: (val) => {
            this.createName = val
          }
        }
      })
    }

我看有人写一个自定义template 在页面引入后 在return引入这个模板好麻烦，如何在当前页面拼一个出来。有大神能给下实例不。
https://segmentfault.com/a/11... 不想这样引用。

Answer 1

没用过iview

可以尝试使用 jsx，然后在 render哪里写jsx

怎么配置 vue 的jsx 相关插件，出门右转vue官网，很详细。

Answer 2

直接写一个modal，点击按钮显示出来，并且在里面写入表单就行了

Answer 3

你可以这样：

this.$Modal.confirm({
    render: (h) => {
        return h('div', [
            h('Input', {
                props: {
                    value: '',
                    autofocus: true,
                    placeholder: '请输入...'
                },
                on: {
                    input: (val) => {
                        ...;
                    }
                }
            }),
            ...
        ])
    }
})