vue element nocode admin
1.0.0
element-ui's code visual editor automatically generates form code and list code. Not a visual solution, more like a tool to generate templates
Web version, in
previewbranch
npm install -g ele-cliThe server occupies port 3000
ele ui
There are two places in a form that need to be edited. One is the properties of the form itself, such as the form object, the Ref of the form (used for form validation), and the other is the form elements contained in the form.
Form attributes can be edited in the form attribute editing area. There are two ways to generate form elements.
Drag the form element to the drag area, and then edit the form element properties
As a form editing tool, although drag and drop is simple, it is still troublesome when there are a large number of forms.
Because our company's interface is managed through swagger, its post interface lists the data, as shown below
You can easily paste data into the input box of a JSON form object, and nested objects are supported.
But the pasted data only has value, so I defined a structure like value:label , with value as the value of the form and label as the label of the form. Note that label needs to be enclosed in quotation marks.
{
"id" : 'ID' ,
"title" : '标题' ,
"type" : '类型'
}Then click to generate the form. Input is generated by default and can be modified in the form element editing area.
Paste the data returned by the backend into the input box of the generated form, generate the form, and then edit the table header. Table queries will be added later.
? sarva
Give a ️ if this project helped you!
