avalon 选项卡切换问题，该怎么解决？
最近在看avalonJS，看到http://www.cnblogs.com/vajoy/p/4063824.html 这篇文章，对于最后面的例子很是疑惑。在这个代码的基础上应该怎样解决问题？
希望用过avalon的朋友解答一下，谢谢！
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="js/avalon.js"></script>
</head>
<body>
<script type="text/javascript">
var gg=[
{"id":"1","title":"公告文章标题1"},
{"id":"2","title":"公告文章标题2"},
{"id":"3","title":"公告文章标题3"},
{"id":"4","title":"公告文章标题4"}];
var bd=[
{"id":"1","title":"媒体报道文章标题1"},
{"id":"2","title":"媒体报道文章标题2"},
{"id":"3","title":"媒体报道文章标题3"},
{"id":"4","title":"媒体报道文章标题4"}];
</script>
<div ms-controller="list">
<span ms-mouseover="changeUl(1)">公告</span>
<span ms-mouseover="changeUl(0)">媒体报道</span>
<a ms-attr-href="'#!/'+ more_name">{{more_text}}</a>
<ul>
<li ms-repeat="infoList">
<a ms-attr-href="'#!/'+ more_name + '/' + el.id" ms-title="el.title">{{el.title}}</a>
</li>
</ul>
</div>
<script type="text/javascript">
var vm = avalon.define({
$id: "list",
more_name: "gg",
more_text: "更多公告",
gg:gg,
bd:bd,
infoList:gg,
changeUl:function(flag){
console.table(gg)
if(flag){ //鼠标移过“公告”选项卡头部
vm.more_name = "gg";
vm.more_text = "更多公告";
vm.infoList = vm.gg;
}else{ //鼠标移过“媒体报道”选项卡头部
vm.more_name = "bd";
vm.more_text = "更多报道";
vm.infoList = vm.bd;
}
}
});
avalon.scan();
</script>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
http://avalonjs.coding.me/cn/examples.html 这里有一个切换卡，基于avalon2