iview - 官网的 RadioGroup的示例代码无法生效
本文介绍了iview - 官网的 RadioGroup的示例代码无法生效的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iview example</title>
<link rel="stylesheet" type="text/css" href="iview/styles/iview.css">
<script type="text/javascript" src="vue/vue.min.js"></script>
<script type="text/javascript" src="iview/iview.js"></script>
</head>
<body>
<div id="app">
<RadioGroup v-model="phone" vertical >
<Radio label="apple">
<Icon type="social-apple"></Icon>
<span>Apple</span>
</Radio>
<Radio label="android">
<Icon type="social-android"></Icon>
<span>Android</span>
</Radio>
<Radio label="windows">
<Icon type="social-windows"></Icon>
<span>Windows</span>
</Radio>
</RadioGroup>
</div>
<script>
var vm=new Vue({
el: '#app',
data: {
phone: 'apple'
}
})
</script>
</body>
</html>不知道为什么没能生效，麻烦帮忙看下问题，谢谢
解决方案
将RadioGroup标签名改成Radio-group即可。iView在非render/template模式下的标签名称不一样。详情请查看官方文档或者源码。代码修改之后如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>iview example</title>
<link rel="stylesheet" type="text/css" href="iview/styles/iview.css">
<script type="text/javascript" src="vue/vue.min.js"></script>
<script type="text/javascript" src="iview/iview.js"></script>
</head>
<body>
<div id="app">
<Radio-group v-model="phone" vertical >
<Radio label="apple">
<Icon type="social-apple"></Icon>
<span>Apple</span>
</Radio>
<Radio label="android">
<Icon type="social-android"></Icon>
<span>Android</span>
</Radio>
<Radio label="windows">
<Icon type="social-windows"></Icon>
<span>Windows</span>
</Radio>
</Radio-group>
</div>
<script>
var vm=new Vue({
el: '#app',
data: {
phone: 'apple'
}
})
</script>
</body>
</html>这篇关于iview - 官网的 RadioGroup的示例代码无法生效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
