Reactjs 如何将React中的参数从函数传递到类

我是reactjs的新手，我想问一下是否有可能做到这一点

我有两个文件，我想把locationProps从Daily.js传递到myData.js

这是我的密码：

myData.js

class myData {
  constructor() {
    this.updateData();
  }

  getTimes(date = null) {
    date = date === null ? moment().format('DD/MM/YYYY') : date;
    var data = this.getData();
    return data ? data[date] : [];
  }


  getSpeadsheetUrl() {
    return config.SpeadsheetUrl[locationProps]; // -----> How to pass this locationProps ? 
  }

function Daily({ locationProps = 1, root }) {
  const context = useContext(ThemeContext);
  const localization = useCallback(() => {
    if (root && cookies.get("location") !== undefined) {
      return cookies.get("location");
    }
    return locationProps;
  }, [locationProps, root]);


const getTimes=() =>{
  var _data = new myData();
  return _data.getTimes();
}

---

Daily.js

class myData {
  constructor() {
    this.updateData();
  }

  getTimes(date = null) {
    date = date === null ? moment().format('DD/MM/YYYY') : date;
    var data = this.getData();
    return data ? data[date] : [];
  }


  getSpeadsheetUrl() {
    return config.SpeadsheetUrl[locationProps]; // -----> How to pass this locationProps ? 
  }

function Daily({ locationProps = 1, root }) {
  const context = useContext(ThemeContext);
  const localization = useCallback(() => {
    if (root && cookies.get("location") !== undefined) {
      return cookies.get("location");
    }
    return locationProps;
  }, [locationProps, root]);


const getTimes=() =>{
  var _data = new myData();
  return _data.getTimes();
}

函数应用程序（）{
返回(
{locations.map（位置=>(
(
导出默认应用程序；

这不是一个真正的reactjs问题。这只是一个正常的JS问题，碰巧涉及react

myData是一个类，因此为了向其中传递数据，您需要将该数据设置为其构造函数中的参数，然后可以使用

newMyData（locationProps）

希望这有帮助

class myData {
  constructor(locationProps) {
    this.locationProps = locationProps;
    this.updateData();
  }

  getTimes(date = null) {
    date = date === null ? moment().format('DD/MM/YYYY') : date;
    var data = this.getData();
    return data ? data[date] : [];
  }

  getSpeadsheetUrl() {
    return config.SpeadsheetUrl[this.locationProps]; // -----> How to pass this locationProps ?
  }
}


function Daily({ locationProps = 1, root }) {
  const context = useContext(ThemeContext);
  const localization = useCallback(() => {
    if (root && cookies.get('location') !== undefined) {
      return cookies.get('location');
    }
    return locationProps;
  }, [locationProps, root]);

  const getTimes = () => {
    var _data = new myData(locationProps);
    return _data.getTimes();
  };
}

---

更新

getSpreadshhetUrl

以将

locationProps

作为参数，以便可以传递它们：

getSpeadsheetUrl(locationProps) {
  return config.SpeadsheetUrl[locationProps];
}

然后在实例化的

\u data

实例上的

Daily

中，您可以使用当前的

locationProps

_data.getSpreadSheetUrl(locationProps);

您可能只想在

locationProps

更改时调用此函数，以便将其置于以下效果：

useEffect(() => {
  _data.getSpreadSheetUrl(locationProps);
}, [locationProps]);

现在的问题是

\u数据是什么，在哪里？我建议将其存储在ref中，以便从整个功能组件访问：

function Daily({ locationProps = 1, root }) {
  const _data = useRef(new myData());

  ...

  useEffect(() => {
    _data.current.getSpreadSheetUrl(locationProps);
  }, [locationProps]);

  ...

  const getTime = () => _data.current.getTimes();

  ...
}

辅助建议

设置
locationProps
值时，可以使用
array.map
索引参数并省略索引搜索

locations.map((location, index) => (
  <Route
    key={location}
    exact
    path={`/${slugify(location, {
      replacement: "-",
      remove: null,
      lower: true
    })}`}
    render={() => (
      <Daily locationProps={index} />

locations.map（（位置，索引）=>(
(
Hi，你能分享更完整的代码吗？
Daily
是如何呈现的？Daily

和

myData

之间的关系是什么？这里是Daily.js

const getTimes=（）=>{var\u data=new myData（）；return\u data.getTimes（）}中的关系

噢，从

每日

到函数的一些道具，你是说

\u data.getSpreadsheetUrl（locationProps）之类的东西吗

？是的，详细信息我从google speadsheet和defaut city locationprop=1中列出了城市列表和Url列表获取Url 1，如果用户更改了城市，则locationprops将更改为城市索引Now只是我希望类myData每天从函数访问此变量（如果可能的话），谢谢谢谢，但我收到错误“locationprops”未定义否undef