Компонент таблицы не отображается в IE11, если указано: «Ошибка при отображении:« Ошибка типа: объект не поддерживает свойство или метод «записи» »» - PullRequest
1 голос
/ 30 мая 2019

Я новичок в разработке веб-приложений и работаю над проектом с использованием компонентов Vue cli, antd, и он работает в IE11.

IE11, похоже, не отображает компонент, а закомментирует таблицу.

элемент IE11

также выдайте ошибку на консоли:

[Vue warn]: Error in render: "TypeError: Object doesn't support property 
or method 'entries'"

Я проверяю тикеты из ant-design-vue, похоже, что ни у кого нет такой же проблемы, поэтому я предполагаю, что это проблема установки polyfill или ES5 to ES6.

ниже мой HTML для страницы

    <template>
      <div id="detailDash">
        <h1>{{id}}</h1>
        <a-table 
          :columns="columns" 
          :dataSource="data" 
          style="padding: 50px;" 
          :bordered="true">
        </a-table>
      </div>
    </template>

код Vuejs

    <script lang="ts">
    import { Component, Prop, Vue } from 'vue-property-decorator';
    const columns = [...];
    const innerColumns = [...];
    export default  {
      data(){
        return {
          id: '',
          status:'',
          data:[....],
          columns,
          innerColumns,
        }
      },
      created() {
          this.id = this.$route.params.envID;
      },
      methods:{
        checkStatus(){
          this.state = 'success'
          return status;
        }
      }
    }
    </script>

babel.config.js

// babel.config.js
    module.exports = {
      presets: [
        ['@vue/app', 
        {
          polyfills: [
            'es6.promise',
            'es6.symbol'
          ]
        }
      ]
      ]
    }

Я весь день гуглял об этой ошибке типа, но никто не давал чистого решения, мне очень нужна помощь для этого !!

1 Ответ

0 голосов
/ 31 мая 2019

Вам нужно добавить полифилы в старые браузеры, чтобы они выполняли код, предназначенный для современных браузеров. Object.entries является примером функции, которой нет в IE.

Как объяснено в моем ответе на этот вопрос , вы можете заполнить статически (в вашем случаеотредактировав babel.config.js) или динамически (используя сервис типа polyfill.io ).Преимущество использования динамического полизаполнения состоит в том, что API доставляет только то, что на самом деле требуется браузеру, что уменьшает размер вашего пакета.

Поскольку вы используете Vue CLI, вам необходимо добавить тег сценария к вашему public / index.html вот так:

<script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=Object.entries%2CSymbol.iterator"></script>

Я включил Object.entries и Symbol.iterator на основе ваших комментариев выше.Вам, вероятно, понадобится больше.Используйте builder для добавления дополнительных функций.

Наконец, вам необходимо постоянно тестировать ваше приложение, чтобы увидеть, какие функции необходимы для успешного выполнения в данном браузере.Возможно, вам придется повторить этот процесс несколько раз, пока все ошибки не исчезнут.Обязательно проведите тестирование на нескольких страницах, поскольку не все ваши пакеты страниц будут иметь одинаковые требования.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...