In this issue, we recommend an efficient Vue low-code form, which is fully visualized and supports one-click generation of source code – Variant Form.
VForm is a low-code form based on Vue 2 and Vue 3, which supports Element UI and iView (Ant Design Vue will be supported soon), and is positioned to provide front-end developers with the ability to quickly build forms, realize form interaction and data collection.
VForm is composed of two parts: VFormDesigner, which generates JSON form objects by dragging and dropping components, and VFormRender, which is responsible for rendering form JSON as Vue components.
Application scenarios: automatic front-end code generation, workflow form design, business management background form editing, general CRUD new/edit forms, data collection (registration forms, application forms, health daily, etc.), questionnaires, low-code development platforms, dynamic form customization, and mobile form design.
Features
Drag-and-drop visual form design, what you see is what you get
Rich form component support, including more than 20 basic form components and advanced components
Supports multiple layout containers, including grids, tables, tabs, and subforms
Expose component interaction events to handle complex interaction logic
Provides a rich set of component API methods
The built-in AXIOS library is convenient for integration and interaction with back-end interfaces
Provides rich component property settings
Support for custom CSS styling
The field component supports custom validation logic
Support multi-language internationalization, built-in Chinese and English two languages
Support PC/H5 form design mode
The form design supports the functions of undoing and redoing history
Good openness, support for extension component API methods
It supports popular browsers such as Chrome, FireFox, Safari, Edge, etc., and is compatible with IE 11 browser
Support browser caching function, automatically save the latest status of the form, no need to worry about the loss of work results
You can export Vue components or HTML source code for easy integration in historical projects
One-click generation of SFC single-file component code, which supports Vue2 and Vue3
The raster container supports PC/Pad/H5 multi-terminal responsive layout
Built-in form template function, common form template, one-click generation
Component hierarchical tree view is supported
Screenshot of the feature
Drag and drop components
Preview
Import JSON
Export JSON
Export the code
SFC is generated
Install VForm
Method 1
VForm depends on the Element UI and needs to be installed first.
Using npm:
Install element-ui
npm i element-ui
Install VForm
npm i vform-builds
Or use yarn:
Install element-ui
yarn add element-ui
Install VForm
yarn add vform-builds
Method two
CDN ingestion, suitable for using components directly in HTML.
1. Git clone VFormBuilds:
https://gitee.com/vdpadmin/VFormBuilds
2. Upload the 6 files in the dist directory to the web server or CDN
3. Introduce js and css in HTML as follows:
a. Use the Form Designer component VFormDesigner in HTML
Disclaimer: This article is published by a third party and represents the views of the author only and has nothing to do with this website. This site does not make any guarantee or commitment to the authenticity, completeness and timeliness of this article and all or part of its content, please readers for reference only, and please verify the relevant content. The publication or republication of articles by this website for the purpose of conveying more information does not mean that it endorses its views or confirms its description, nor does it mean that this website is responsible for its authenticity.
IctcoderFree Source Code An efficient Vue low-code form designer that supports one-click source code generation https://ictcoder.com/an-efficient-vue-low-code-form-designer-that-supports-one-click-source-code-generation/
1. Automatic: After making an online payment, click the (Download) link to download the source code;
2. Manual: Contact the seller or the official to check if the template is consistent. Then, place an order and make payment online. The seller ships the goods, and both parties inspect and confirm that there are no issues. ICTcoder will then settle the payment for the seller.
Note: Please ensure to place your order and make payment through ICTcoder. If you do not place your order and make payment through ICTcoder, and the seller sends fake source code or encounters any issues, ICTcoder will not assist in resolving them, nor can we guarantee your funds!
1. Default transaction cycle for source code: The seller manually ships the goods within 1-3 days. The amount paid by the user will be held in escrow by ICTcoder until 7 days after the transaction is completed and both parties confirm that there are no issues. ICTcoder will then settle with the seller. In case of any disputes, ICTcoder will have staff to assist in handling until the dispute is resolved or a refund is made! If the buyer places an order and makes payment not through ICTcoder, any issues and disputes have nothing to do with ICTcoder, and ICTcoder will not be responsible for any liabilities!
1. ICTcoder will permanently archive the transaction process between both parties and snapshots of the traded goods to ensure the authenticity, validity, and security of the transaction!
2. ICTcoder cannot guarantee services such as "permanent package updates" and "permanent technical support" after the merchant's commitment. Buyers are advised to identify these services on their own. If necessary, they can contact ICTcoder for assistance;
3. When both website demonstration and image demonstration exist in the source code, and the text descriptions of the website and images are inconsistent, the text description of the image shall prevail as the basis for dispute resolution (excluding special statements or agreements);
4. If there is no statement such as "no legal basis for refund" or similar content, any indication on the product that "once sold, no refunds will be supported" or other similar declarations shall be deemed invalid;
5. Before the buyer places an order and makes payment, the transaction details agreed upon by both parties via WhatsApp or email can also serve as the basis for dispute resolution (in case of any inconsistency between the agreement and the description of the conflict, the agreement shall prevail);
6. Since chat records and email records can serve as the basis for dispute resolution, both parties should only communicate with each other through the contact information left on the system when contacting each other, in order to prevent the other party from denying their own commitments.
7. Although the probability of disputes is low, it is essential to retain important information such as chat records, text messages, and email records, in case a dispute arises, so that ICTcoder can intervene quickly.
1. As a third-party intermediary platform, ICTcoder solely protects transaction security and the rights and interests of both buyers and sellers based on the transaction contract (product description, agreed content before the transaction);
2. For online trading projects not on the ICTcoder platform, any consequences are unrelated to this platform; regardless of the reason why the seller requests an offline transaction, please contact the administrator to report.
According to the "Measures for the Supervision and Administration of Online Transactions" issued by the State Administration for Market Regulation, the self declaration of operators who do not need to register is as follows:
"Individuals engaged in sporadic small-scale trading activities do not need to register as market entities according to law"
