Как лучше всего ссылаться на ArrayBuffer js с помощью React/Babel6?

Я пытаюсь обновить холст, используя компонент реакции с обработкой, выполненной в рабочем потоке. У меня все жесткие детали работают нормально в EMCA5, но при портировании на React/Babel/JSX мое самое большое зависание заключается в том, что система больше не распознает ArrayBuffer для передачи данных в рабочий поток. Следующий код умирает с 'TypeError: ArrayBuffer не является конструктором':

import React from 'react';
// import Calculater etc...

export default class CalculationDisplay extends React.Component {
    componentDidMount() {
        var buffer = new ArrayBuffer(100 * 100 * 4);
        var view = new Uint32Array(buffer);
        var calculator = new Calculator(view);
        const ctx = this.refs.canvas.getContext('2d');
        // worker calculation and display goes here...
    }

    render() {
        return (
            <canvas ref="canvas" width={600} height={600}/>
        );
    }
}

После тщательного изучения babel-polyfill и core-js все варианты, которые я мог придумать для следующих, умирают одинаково:

var ArrayBuffer = require('core-js/modules/es6.typed.array-buffer');
import ArrayBuffer from 'core-js/modules/es6.typed.array-buffer';
import { ArrayBuffer } from 'core-js/modules/es6.typed.array-buffer';
import { ArrayBuffer } from 'babel-polyfill';

Единственное, что я нашел, что работает до сих пор - это забыть о любых импортах / потребностях и просто получить доступ к ArrayBuffer, и это похоже на это:

    var buffer = new global.ArrayBuffer(100 * 100 * 4);
    var view = new global.Uint32Array(buffer);

..это на самом деле работает, и дисплей появляется на странице, но кажется уродливым, и я не могу себе представить, что это намеченный способ ссылки на ArrayBuffer. Кто-нибудь успешно импортировал js ArrayBuffer и связанные с ним классы, чтобы к ним можно было получить доступ, как ожидается?

..OK следующее предложение zerkms, которое я обновил:

import React from 'react';
import 'babel-polyfill';
// import Calculater etc...

export default class CalculationDisplay extends React.Component {
    componentDidMount() {
        var buffer = new ArrayBuffer(100 * 100 * 4);
        var view = new Uint32Array(buffer);
. . . 

... и это работает без ошибок - я думаю, я слишком увлекся попыткой импортировать имена классов из babel-polyfill ранее.

0 ответов

Другие вопросы по тегам