How do we use multiple inputs on iView Ui modal

Question

This is an example of code i used

render () {
        this.$Modal.confirm({
            render: (h) => {
              // input 
                return h('Input', {
                    props: {
                        value: this.value,
                        autofocus: true,
                        placeholder: 'Please enter your name...'
                    },
                    on: {
                        input: (val) => {
                            this.value = val;
                        }
                    }
                })
            }
        })
    }

I really do not know how to add another input in this

Answer 1

The render function has to return a single parent element/component. So you need to replace that Input component with a div for example, and then create its children.

A example would be:

const inputAttrs = {
  props: {
    value: this.value,
    autofocus: true,
    placeholder: 'Please enter something...'
  },
  on: {
    input: (val) => {
      this.value = val;
    }
  }
};

new Vue({
  el: '#app',
  data() {
    return {
      value: ''
    }
  },
  methods: {
    render() {
      this.$Modal.confirm({
        render: (h) => {
          return h('div', 
              [h('Input', inputAttrs), h('Input', inputAttrs)]
          )
        }
      })
    }
  }
});

jsFiddle: https://jsfiddle.net/Sergio_fiddle/ckgjzrf5/