Vue.js

[FlowerChen]

Vue.js 的强大

[FlowerChen]

Vue 项目在 IE11 上遇到诸多问题。

[zhihaofans]

？？？

[airyland]

你到底想说啥。

[HLT]

V2 现在 10 个帖了有 8 个是不能看的

[FlowerChen]

@airyland 额 vue 的一个项目有很多问题 然后还没想好具体问啥
exportUrl(index){
console.log("hhhhh");
let params={
'task_id':this.items[index].id
}
this.$http.get('/api/v1/export',{
params:params
}).then(function(data){
var a = document.createElement('a');
var url = window.URL.createObjectURL(data.data);
a.href = url;
a.click();
window.URL.revokeObjectURL(url);
},function(err){
if(data.status === 401){
toastr.error('登录超时')
this.router.push('/login')
return false
}else{
toastr.error('发现一个小问题:' + status)
}
})
}
},

这是一个实现下载附件的方法 在 IE11 上 事件确定被触发啦 但是无法下载

[coo]

@FlowerChen #5 这个问题可能和 Vue 无关，我猜测是创建 a 标签后 click 事件被 IE 拦截，无法下载。

[FlowerChen]

@zhihaofans 有问题的 就是问题比较啰嗦不好描述
这里
<div class="chart" v-for="(chart,index) in charts">
<div class="header">
<div class="title">{{chart.title}}</div>
<div class="subtitle">{{chart.intro}}</div>
</div>
<div class="content">
<div class="bar" :id="'chart-'+ index"></div>
</div>
</div>
用 v-for 从 API 循环读入数据， <div class="bar" :id="'chart-'+ index"></div>这句渲染 charts.length 个 div ，用 echarts 来绘制图表，因为每个图表的类型（ bar 、或者 pie ）和数据都不一样（都是循环从 API 读入），实例化图表的时候用了一个 for 循环：
showChart(){
for (var i = 0; i < this.charts.length; i++) {
if （ type===pie ）
{
var myChart = echarts.init(document.getElementById("chart-" + i));
.......
} else if(type === bar)
{
var myChart = echarts.init(document.getElementById("chart-" + i));
}
.......
}
然后发现，图表画不出来，应为在执行图表实例化的时候， DOM 的渲染还没有结束，于是就用了一个定时器，但是遇到数据库比较卡的时候就歇菜啦！有没有好的方法呀，怎样才能确定 v-for 循环渲染已经结束， v-for 中所有的子元素已经渲染完成啦

[FlowerChen]

@zhihaofans
少贴了一段循环渲染 DOM 的方法：
reloadinfo() {
let params={
'task_ids':[this.$route.query.id],
}
this.$http.get('/api/v1/get_reports',{
params:params
}).then(function(data){
if(data.data.code == 1000){
if(data.data.data == 0){
this.massage = '没有数据'
}
this.charts = data.data.data
}
},function(err){
if (data.status === 401) {
toastr.error('登录超时')
this.$router.push('/login')
return false;
} else {
toastr.error('发现了一个小问题: ' + status)
}
})
},

[LancerComet]

1. 我用 IE 11 执行了这段模拟代码，好像没问题啊，但 IE 11 会让系统打开一个 Blob 而不是 Chrome 中那种直接显示图片.



2. 请在 Vue 文档中找到 nextTick 这段.

[Francost]

楼主难道不会 append 吗？自己回复自己的主题，这...