码迷,mamicode.com
首页 > 其他好文 > 详细

vue 标签页以及标签页赋值

时间:2019-10-11 18:11:08      阅读:82      评论:0      收藏:0      [点我收藏+]

标签:method   src   second   赋值   border   form   ima   http   img   

背景:

使用vue增加了标签页,点击不同标签页传给后端的值不一样,用来做区分,如图:

技术图片

 

 

 

vue代码如下:

使用 form.PageA   form.PageB ,后端接收到的值 first、second  1、0

 1 <template>
 2     <div>
 3     <el-form ref="form" :model="form" label-width="80px">
 4     <el-tabs v-model="form.PageA" type="border-card" @tab-click="handleClick">
 5 
 6         <el-tab-pane label="标签页1" name="first">
 7         <el-tabs v-model="form.PageB" >
 8             <el-tab-pane label="标签页a" name="0">
 9         </el-tab-pane>
10 
11             <el-tab-pane label="标签页b" name="1">
12         </el-tab-pane>
13 
14             </el-tabs>
15 
16         </el-tab-pane>
17 
18       <el-tab-pane label="标签页2" name="second">
19 
20 
21         </el-tab-pane>
22         </el-tabs>
23 
24 
25     </el-form>
26 
27 
28     </div>
29 </template>
30 
31 
32 
33 
34 <script>
35 
36 
37 export default {
38   data() {
39     return {
40 
41         form: {
42             PageA:‘‘,
43             PageB:‘‘
44         }
45     }
46   },
47 
48 methods: {
49 
50       },
51 
52 
53 }
54 </script>

 

vue 标签页以及标签页赋值

标签:method   src   second   赋值   border   form   ima   http   img   

原文地址:https://www.cnblogs.com/whycai/p/11655684.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!