Я использовал приведенную ниже структуру для создания компонента реакции, который работает в браузере после выполнения babel. Но в моем случае спецификация макета не работает, поскольку React объявлен только в компоненте Base. Почему наследование не работает в спецификации?

Base.js

import React from 'react';

export default class Base extends React.Component {

}

Layout.js

import 'Base' from './Base';

export default class Layout extends Base {
const sample = React.cloneElement(this.props.data, {ref: 't'});

}

Тестовый пример

import Layout from 'component/Layout'
import React from 'react';

describe('Layout', () => {
}

Сообщение об ошибке:

ReferenceError: Can't find variable: React

Mr. Black

Ответов: 1

Ответы (1)

В Layout.js у вас есть следующая строка

const sample = React.cloneElement(this.props.data, {ref: 't'});

Здесь вы ссылаетесь на React, но Layout.js не имеет определения для React, аналогично тому, как у вас нет доступа к идентификаторам в разных закрытиях, поэтому будет выдано ReferenceError

Если вы хотите использовать эту ссылку, вам нужно сначала научить его Layout.js, снова включив строку import

import React from 'react';

Если вы не хотите иметь вторую строку импорта, вы можете

  1. Реэкспорт React в Base.js, поэтому один импорт выполняет оба import {foo, bar} из 'baz';
  2. Посмотрите, можете ли вы ссылаться на то, что хотите через идентификатор, который вы видите, например через Object.getPrototypeOf (Base.prototype) .constructor?

Поскольку вы создаете React в качестве глобального в Test Case, ошибка ReferenceError в mocha может быть выброшена слишком рано, перемещая import React строка над строкой import Layout должна исправить это

2022 WebDevInsider