Display form types other than text or checkbox

[tonyhayes]

Do you have any advice on how to modify the tree to display/edit (for example) a date picker instead of just text. I would like to fork this and use to display a dynamic form (whose attributes exist in the node to determine a form component to display such as a date picker or dropdown, radio button ...). I think the NodeContent.vue is where I want to make the changes to support this ?

[erhard]

There is an example... https://jsfiddle.net/amsik/6jm2b1dq/?utm_source=website&utm_medium=embed&utm_campaign=6jm2b1dq

You don't change NodeContent... Define the data as described in the doc an add Your individual data in the data property. In Your the template which is embedded in a scoped slot You can do what You want with the node data even pass them to other components. Here the snippet from the fiddle above

            <span class="tree-text" slot-scope="{ node }">
              <template v-if="!node.hasChildren()">
                <i class="ion-android-star"></i>
                {{ node.text }}                                    <<<---Here You can access your data
              </template>

              <template v-else>
                <i :class="[node.expanded() ? 'ion-android-folder-open' : 'ion-android-folder']"></i>
                {{ node.text }}
              </template>
            </span>
          </tree>```