[vue.js] 根据对应的选择内容，选中对应的radio按钮

开发中遇到一个内容，当你选中一个列表内容时，radio也要对应的进行选中。现已解决。于是贴一个例子出来和大家分享

 

 HTML：

    

        

            

                

                     {{menu.title}}
                    

                        

                            {{subMenu.title}}
                        
                    
                
            
        
    
    

        

           
            

                菜单动作:
                

                    
                         链接
                     
                     触发关键字
                
                
            
        
    
  

JS：

Vue.config.debug = true
var vm = new Vue({
    el: '#app',
    data: {
        selected: -1,
        selectedSub: -1,
        currentNode: {
        	title: "",
            type: null,
        },
        menus: [
            {
                "title": "菜单名称1",
                "type": 0,
                "subMenus": [
                    {"title": "子菜单1-1", "type": 0},

                    {"title": "子菜单1-2", "type": 1},

                ]
            },
        ]
    },
    computed: {
        selectedItemType: function () {
            const currentSelect = this.currentSelect()
            if(!currentSelect) return null
            return currentSelect.type
        },
    },
    methods: {
     select: function (parentIndex = -1, childIndex = -1) {
            this.selected = parentIndex
            this.selectedSub = childIndex
            
            this.currentNode = { 
              title: this.selectedItemTitle,
                type: this.selectedItemType,
                value: this.selecetdItemValue
            }
        }, 
       currentSelect: function() {
            if (this.selectedSub === -1) {
                return this.menus[this.selected]
            }
            return this.menus[this.selected].subMenus[this.selectedSub]
        }, 
    }
});

或者大家可以直接在编辑器中进行查看。https://jsfiddle.net/monobright/s02ocme3/3/?utm_source=website&utm_medium=embed&utm_campaign=s02ocme3
主要的功能点就是这个了，各位也可以根据需求进行相应的更改(*^▽^*)