Boss a brain, the master tired broken waist

Two months ago, my boss strolls into the office on a sunny, sweet-smelling morning with a mug in hand and finds me reviewing a classic front end blog post, “I don’t Want to Write Forms Anymore.”

“Big brother, THIS article I also read, still don’t say, write needle not poke!”

“This is the third time I have seen it. It is not easy to do the front end. This kind of changing form looks big…”

“Requirements change, so you need to code again, test, release, deploy again.”

“That is not true, add a button also have to retest, release, eyes open one shut, a day passed ~~ howl”

“Big brother, do you think we can get a form of new wheel, save the front of the XDJM people in trouble?”

“We can do it, but there are so many wheels on the list that we have eight, if not ten.”

“If you want to do something distinctive, this is called differentiation competition!”

“Like what?”

“First of all, it has to be easy to get started. Configured forms are obsolete. Who can remember all those properties? So it has to be drag-and-drop, you can use it.”

“OK, I got it.”

“The second is to meet the complex interactive logic, there is no interactive form where the soul! ?”

“Good, this also arrange on!”

“Of course, the form of data verification should also be considered comprehensive, regular verification, custom verification to arrange on!”

“Satisfied, this must be satisfied!

“Also, CSS style what also want to build in, form not good-looking, style to gather!”

“I am not familiar with CSS, I will consider this ~~”

“Consider what? Don’t wait, start today, two months later I will check the goods!”

“…”

= = = = = = = = = = = = = = = = = = = line, this is a golden line = = = = = = = = = = = = = = = = = = =

VForm is just getting started

After two months of digging, filling the pit, the master glory to complete the task of a new wheel – VForm, VForm full name is not VueForm, but VariantForm (see this name certainly not popular).

variant

The [ˈ ve goes ri goes nt]

The [ˈ veri goes nt]

n.

Variant; Variant; Deformation;

adj.

Variable; 2. Differing, distinct, or inconsistent; A variety of; 2. Changeable or indefinite;

Here the Variant is extended as flexible, changeable, intangible, as you need to change, I should change with the same.

Waste what words ah, directly on dry goods: click this immediate experience

Let’s start with a GIF:

Let’s use a GIF to feel the interaction (click the mouse to enlarge the view) :

Feel the advanced interaction (click to zoom in) :

= = = = = = = = = = = = = = = = = = = line, this is a golden line 2 = = = = = = = = = = = = = = = = = = =

VForm highlights

1. What you see is what you get, drag-and-drop design, 0 start-up cost;

2. Supports more than 20 kinds of container components and field components;

3. Supports multiple data verification methods, including mandatory, built-in verification function, regular expression, and custom verification.

4. Support custom CSS style, custom function;

5. Support rich interactive events and API methods;

6. Directly export the Vue component source code or HTML source code, it can be integrated with the existing project in one minute;

More features: www.yuque.com/variantdev/…

Common application scenarios of VForms

Vforms can be used in the following scenarios:

1. Workflow form design;

2. Business management background form editing;

3. CRUD create/edit forms;

4. Data collection (application forms, application forms, health daily reports, etc.);

5. Questionnaire survey;

6. Low code development platform

Finally, the hard dishes are served

Library file repository (not including source code) : github.com/vdpAdmin/VF…

Gitee Backup warehouse: gitee.com/vdpadmin/VF…

Using document: www.yuque.com/variantdev/…

Online demo: http://120.92.142.115/

Most important, must put last, have the source code? Have!!!!!! (Described in the documentation)

Today’s introduction is over here, the next phase of the specific VForm coding implementation process and a variety of pit experience, and listen to the next decomposition.