<> Simple association between step bar and tab

1. Step bar :

Step bar acitve Property is used to set the currently active step , The type is number
<el-steps :active="active - 0" finish-status="success"> <el-step title=" step 1">
</el-step> <el-step title=" step 2"></el-step> <el-step title=" step 3"></el-step> </
el-steps>
2. Tab :

Tab v-model In the property binding tab name value , The type is string
<el-tabs :tab-position="tabPosition" style="height: 200px" v-model="active"> <
el-tab-pane name="0" label=" user management "> user management </el-tab-pane> <el-tab-pane name="1" label
=" configuration management "> configuration management </el-tab-pane> <el-tab-pane name="2" label=" Role management "> Role management </el-tab-pane>
</el-tabs>
3. Connect the two , You just need to active and v-model Bind the same variable , But the former is number, The latter is string, So in the step bar active
Minus the value of 0 Just fine

Technology
©2019-2020 Toolsou All rights reserved,
Solve in servlet The Chinese output in is a question mark C String function and character function in language MySQL management 35 A small coup optimization Java performance —— Concise article Seven sorting algorithms (java code ) use Ansible Batch deployment SSH Password free login to remote host according to excel generate create Build table SQL sentence Spring Source code series ( sixteen )Spring merge BeanDefinition Principle of Virtual machine installation Linux course What are the common exception classes ?