vue学习笔记（一）

1. 项目需求是左侧展示短信的类型（动态从后台获取），如下：

 

2. 提交到后台的请求代码如下：

$Yx.AjaxRequest({
module: 'dataSet',
method: 'post',
name: 'MessageQuery.messageCount',
version: '2.0',
data:param,
token: store.getters.token
}).then(resp => {
me.countList = resp.data.data;
console.log("左侧菜单及条数"+JSON.stringify(resp.data.data))

}).catch(() => {
console.log("error")
})
3.页面展示的代码如下：

<div style="width: 150px;height: 500px;float: left;background-color: white">
<ul style="list-style-type:none;white-space:nowrap;margin-top: 5px;margin-left: 5px">
<li style="margin-top:15px;margin-left:15px;height: 30px" v-for="sms in countList" @click="find_notice(sms.smsType)">{{sms.smsTypeName}}<span class="label label-info">{{sms.smsCount}}</span></li>
</ul>
</div>
重点来了-->

点击左侧短信类型，右侧对应显示短信条数，向后台再次发起请求，需要传递参数，写法如下：

@click="find_notice(sms.smsType)"
---------------------
作者：tom0915
来源：CSDN
原文：https://blog.csdn.net/tom0915/article/details/83340156
版权声明：本文为博主原创文章，转载请附上博文链接！