In addition to Weibo, there is also WeChat
Please pay attention
WeChat public account
Shulou
2025-02-25 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >
Share
Shulou(Shulou.com)06/02 Report--
What is the method of Vue to obtain form data? in view of this question, this article introduces the corresponding analysis and answer in detail, hoping to help more partners who want to solve this problem to find a more simple and easy way.
Demand
Use Vue to collect the following user data:
Get the data and submit
Code implementation:
Bind the value of value to the variable property
V-model.trim = 'username'; remove spaces at both ends
V-model.number = 'age'; converts a string to a numeric value
V-model.lazy = 'age'; not immediately, but after switching focus
Get the form data user name:
Password:
Age:
Gender: male and female
Hobbies: table tennis, basketball, football
Select a city:
Choose the city Zhengzhou, Wuhan, Beijing
Description:
Read and accept the user Agreement submission Vue.config.productionTip = false new Vue ({el: "# container", data: {user: {username: ", password:" Age: ", sex:", hobby: [], city: ", desc:", agree: ",}} Methods: {submit (event) {console.log ("submit form") / / in form Parameter automatic submission console.log (JSON.stringify (this.user))},},}) template filter template filter {{time | timeFormatter}}
{{time | timeFormatter ("YY-MM-DD hh:mm:ss")}} Vue.config.productionTip = false / / Global filter Vue.filter ("myFilter", function (value) {return 'global filter'}) new Vue ({el: "# container", data: {time: 1639579694662, / / timestamp, not a string}, / / local filter) can be used in all components Filters: {timeFormatter (time) is used inside the component Format) {/ / first parameter if (format) {return dayjs (time) .format (format)} else {return dayjs (time) .format ("YYYY-MM-DD HH:mm:ss")}} },}) usage scenarios of the filter
1. Used in interpolation syntax
2.v-bind: attribute ='xx | xx'
Deal with some simple operations and produce new data
This is the answer to the question about Vue's method of obtaining form data. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel to learn more about it.
Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.
Views: 0
*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.
Continue with the installation of the previous hadoop.First, install zookooper1. Decompress zookoope
"Every 5-10 years, there's a rare product, a really special, very unusual product that's the most un
© 2024 shulou.com SLNews company. All rights reserved.