iview 兼容ie（部分功能）

郑重警告：我的代码在ie9下没有生效,只是在360的ie仿真模式下可以了（很疑惑，不是说是一个内核吗）

吐槽下：iview号称适配ie9，大爷的他们官网在ie9下都错乱了

1安装依赖

npm install babel-polyfill --save

 

2 在mian.js最前面添加

   import 'babel-polyfill'

 

3在main.js中添加下面的代码

if (window.HTMLElement) {

if (Object.getOwnPropertyNames(HTMLElement.prototype).indexOf('dataset') === -1) {

Object.defineProperty(HTMLElement.prototype, 'dataset', {

get: function () {

var attributes = this.attributes; // 获取节点的所有属性

var name = [];

var value = []; // 定义两个数组保存属性名和属性值

var obj = {}; // 定义一个空对象

for (var i = 0; i < attributes.length; i++) { // 遍历节点的所有属性

if (attributes[i].nodeName.slice(0, 5) === 'data-') { // 如果属性名的前面5个字符符合"data-"

// 取出属性名的"data-"的后面的字符串放入name数组中

name.push(attributes[i].nodeName.slice(5));

// 取出对应的属性值放入value数组中

value.push(attributes[i].nodeValue);

}

}

for (var j = 0; j < name.length; j++) { // 遍历name和value数组

obj[name[j]] = value[j]; // 将属性名和属性值保存到obj中

}

return obj; // 返回对象

},

});

}

}

// window.requestAnimationFrame多浏览器兼容问题补丁

// http://paulirish.com/2011/requestanimationframe-for-smart-animating/

// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating

// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel

// MIT license

 

(function () {

var lastTime = 0;

var vendors = ['ms', 'moz', 'webkit', 'o'];

for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {

window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];

window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] ||

window[vendors[x] + 'CancelRequestAnimationFrame'];

}

 

if (!window.requestAnimationFrame) {

window.requestAnimationFrame = function (callback, element) {

var currTime = new Date().getTime();

var timeToCall = Math.max(0, 16 - (currTime - lastTime));

var id = window.setTimeout(function () { callback(currTime + timeToCall); },

timeToCall);

lastTime = currTime + timeToCall;

return id;

};

}

 

if (!window.cancelAnimationFrame) {

window.cancelAnimationFrame = function (id) {

clearTimeout(id);

};

}

}());

//remove报错处理

if (!('classList' in document.documentElement)) {

Object.defineProperty(HTMLElement.prototype, 'classList', {

get: function () {

var self = this;

function update (fn) {

return function (value) {

var classes = self.className.split(/\s+/g);

var index = classes.indexOf(value);

 

fn(classes, index, value);

self.className = classes.join(' ');

};

}

 

return {

add: update(function (classes, index, value) {

if (!~index) classes.push(value);

}),

 

remove: update(function (classes, index) {

if (~index) classes.splice(index, 1);

}),

 

toggle: update(function (classes, index, value) {

if (~index) { classes.splice(index, 1); } else { classes.push(value); }

}),

 

contains: function (value) {

return !!~self.className.split(/\s+/g).indexOf(value);

},

 

item: function (i) {

return self.className.split(/\s+/g)[i] || null;

},

};

},

});

}

4.调整下布局的属性基本就可以了