У меня есть приложение Vue, которое должно работать в браузере ES5 (iOS 9).
Некоторые функции в компонентах Vue преобразованы в функции стрелок: ()=>
, который ломается iOS9 Safari. И я действительно не понимаю, почему некоторые преобразованы правильно, а некоторые нет.
Пример:
Это часть компонента vue:
data() {
return {
birthday: '',
accepted: false,
acceptedForSelectedKids: false
};
},
computed: {
dataPrivacyLink() {
return settings.data_privacy_link;
},
isOverFifTeen() {
if (this.privacyToEdit && this.privacyToEdit.owner.age) {
return this.privacyToEdit.owner.age > 15;
}
if (this.birthday) {
return differenceInCalendarYears(new Date(), new Date(this.birthday)) > 15;
}
return false;
}
Функции data
и dataPrivacyLink
передаются в функции стрелок, но не в функцию isOverFifTeen
.
Вот как это выглядит в транспортированном виде:
data:()=>({birthday:"",accepted:!1,acceptedForSelectedKids:!1}),computed:{dataPrivacyLink:()=>settings.data_privacy_link,isOverFifTeen(){return this.privacyToEdit&&this.privacyToEdit.owner.age?this.privacyToEdit.owner.age>15:!!this.birthday&&function(e,t){Object(c.a)(2,arguments);var o=Object(a.a)(e),n=Object(a.a)(t);return o.getFullYear()-n.getFullYear()}(new Date,new Date(this.birthday))>15}
Вот как webpack настроен:
{
test: /\.vue$/i,
loader: 'vue-loader'
},
{
test: /\.js$/,
loaders: ['babel-loader'],
exclude: [/node_modules/]
},
И это babel.config.js
:
module.exports = {
presets: [['@babel/preset-env', { modules: false }]],
plugins: ['@babel/plugin-syntax-dynamic-import'],
env: {
test: {
presets: [['@babel/preset-env']]
}
}
};
В пакете. json Я настроил, какие браузеры использовать:
"browserslist": [
"> 0.5%",
"last 2 versions",
"not ie <= 11",
"ios_saf >= 9",
"not dead"
]
Как остановить эти стрелочные функции?