Question

我正在构建一个ReactJS应用程序。在React Component将要存在的页面上，有一个我希望React可以访问的现有JS对象。

由于npm run-scripts build的放大过程，我无法按名称访问变量。有没有办法在不必进行休息API调用的情况下执行此操作？

我尝试使用componentDidMount的生命周期事件来访问JS对象并将其推入状态，但它抱怨它无法找到它。如果我在React应用程序中使用虚拟数据定义对象，我可以看到它仍然引用React中的虚拟数据（通过componentDidMount中的console.log）。如果我在Chrome中使用JavaScript控制台，我可以看到该值是新值。这是一个问题，因为React在它自己的容器中运行，并且它无法访问现有的JS对象吗？

非常感谢任何帮助。

<小时/> 的更新

我的限制是我的服务器端框架。我目前需要使用ASP.Net WebForms。我在页面中创建了一个<asp:Literal项，并使用JS对象更新了它的值。

这就是我的Basic React App的样子。

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

/* THIS WILL  BE POPLATED BY C# */
var EntityObject = { Person: { FirstName: 'Foo', LastName: 'Bar' }};

class App extends Component {
  constructor(props) {
    super(props);

    this.state = {
      name: 'DEFAULT'
    }
  };

  componentDidMount() {
    console.log(this.state);
    this.setState({name: EntityObject.Person.FirstName + ' ' + EntityObject.Person.LastName })
  }

  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">{this.state.name}</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}

export default App;

C＃代码看起来像这样

string sample = @"EntityObject = { Person: { FirstName: 'Test', LastName: 'User' } }";
<asp:Literal ID="jsContainer" runat="server">
jsContainer.Value = "<script>" + sample + "</script>";

ReactJS访问现有变量？

0 个答案: