html和vue混合开发

1.首先在页面引入vue.js(不熟悉vue项目的,可以在自己的项目引入使用)
2
3.其次就是页面的渲染了怎么让ajax请求到数据给到页面呢,写个关于聊天的小demo吧!
/chat.id是来判断发消息的是自己还是别人
如果是1就是自己一般居右否则用v-else居左
其中布局使用flex布局
/
html部分//

/css部分,其中rightarrow和leftarrow是用css3写的小三角/

.leftarrow {
margin-top: 5px;
width: 0;
height: 0;
font-size: 0;
border: solid 8px;
border-color: #051A2D #051A2D #051A2D #2e7bb2
}
.rightarrow {
margin-top: 5px;
width: 0;
height: 0;
font-size: 0;
border: solid 8px;
border-color: #051A2D #2e7bb2 #051A2D #051A2D
}
js部分//
var vm = new Vue({
el: ‘#app’,
data: {
dataList: []
},
});
pageUtils.HZAjax(pageUtils.HZ_ANSWER, formData, function(data) {
console.log(“13data:” + JSON.stringify(data))
if(null != data) {
var q_content = spellAnswer(q_content);
var lawContent = spellLaw(lawContent);
var caseContent = spellExample(caseContent);
html+=’

’+q_content+’

’+lawContent+’

’+caseContent+’

’;
vm.dataList.push({
ans: html
})

}, function() {
pageUtils.showToast(‘服务器异常’);
});
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值