title: How declare v-model for custom component in vue render function?
body: <p>I have code below:</p>
  
  <pre class="lang-js prettyprint-override"><code>...
  var label_key_map = { a: "1", b: "2", c: "3", d: "4" }
  render: (h) =&gt; {
    var form_data = {}
    for (let key in label_key_map) {
      var form_item = h(
        'FormItem',
        {props: {prop: key}},
        [h('Input', {props: {type: "text", vModel: "form_data.key"}})]
      )
    }
  </code></pre>
  
  <p>In the for-loop I want to bind the <code>form_data.a</code>, <code>form_data.b</code>, <code>form_data.c</code> to every <code>Input</code>.</p>
  
  <p>But when I use  <code>vModel: "form_data[key]"</code> or <code>vModel: "form_data.key"</code>, neither work. It seems the correct way to write in general is: <code>vModel: "form_data.a"</code>?</p>
  
  <p>How to solve this in the <code>for</code>-loop? </p>
  
  <hr>
  
  <p>Edit: The actual case is an <a href="https://www.iviewui.com/components/form" rel="nofollow noreferrer">IView <code>Form</code></a>. Example:</p>
  
  <pre><code>&lt;Form :model="formValidate"&gt;
      &lt;FormItem label="E-mail" prop="mail"&gt;
          &lt;Input v-model="formValidate.mail" placeholder="Enter your e-mail"&gt;&lt;/Input&gt;
      &lt;/FormItem&gt;
  &lt;/Form&gt;
  </code></pre>
  
  <p>My <code>form_data</code> in this example is the <code>formValidate</code>. I use the <code>for</code>-loop generate the <code>form_data</code>, but I can not use <code>"form_data.a"</code>. How to bind the <code>v-model</code> (of the custom component <code>Input</code>) now?</p>