小编Moe*_*Moe的帖子

Mobx - runInAction() 用法。为什么我们需要它?

我已经阅读了关于这个主题的各种网站,但我还没有弄清楚为什么我们需要这种runInAction方法以及它究竟是如何工作的。

有人可以向我解释runInAction功能吗?

谢谢。

javascript reactjs mobx

21
推荐指数
1
解决办法
1万
查看次数

如何在 React Router 中解析查询字符串

你好,我正在使用 react 路由器,我需要传递一些查询字符串参数

试过

<Route path="/result/:type?/?filter=:filter?" exact strict component={Result}/>
Run Code Online (Sandbox Code Playgroud)

我期待捕捉像这样的网址

/result
/result/animals
/result/cars
/result/animals?filter=cats,dogs
/result/cars?filter=sedan,truck
Run Code Online (Sandbox Code Playgroud)

正确的做法是什么?

javascript reactjs react-router

13
推荐指数
1
解决办法
2万
查看次数

如何使用Material-UI Autocomplete组件选择多个选项并添加新选项?

目标

我有一个多个字段:

  1. 我们可以选择自动完成中存在的用户(我通过 API 检索的列表)
  2. 我们可以输入新用户的名称,并用逗号分隔它们

为此,我需要检索valueinputValue的值。对于value,没有问题,但是对于inputValue,有一些我不明白的东西

问题

当我修改onInputChangeinputValue的值时,它的状态会像这样被修改和重置

信息

我基于Material UI 提供的示例

沙盒中的代码

代码

import React from "react";
import TextField from "@material-ui/core/TextField";
import Autocomplete from "@material-ui/lab/Autocomplete";

interface User {
  id: number;
  name: string;
}

const userList: User[] = [
  { id: 1, name: "name 1" },
  { id: 2, name: "name 2" },
  { id: 3, name: "name 3" }
];

export default function AutocompleteControlled() …
Run Code Online (Sandbox Code Playgroud)

javascript typescript reactjs material-ui

12
推荐指数
1
解决办法
5万
查看次数

获取api时未调用useEffect且未更新状态

我正在使用 useEffect 钩子从天气 api 获取数据并正确声明依赖项。我的状态仍未更新,因此我的渲染函数出现错误。我几乎尝试了从摆脱依赖数组到在依赖数组中声明倍数的所有方法。我不知道我的功能有什么问题。API 的 JSON 响应格式如下:

{
 location: {
 name: "Paris",
 region: "Ile-de-France",
 },
 current: {
  last_updated_epoch: 1564279222,
  last_updated: "2019-07-28 04:00",
  temp_c: 16,
  temp_f: 60.8,
  is_day: 0,
  condition: {
    text: "Clear",
    icon: "//cdn.apixu.com/weather/64x64/night/113.png",
    code: 1000
  },
  wind_mph: 6.9,
  wind_kph: 11.2
 }
}
Run Code Online (Sandbox Code Playgroud)

这就是我的代码的样子:

const Weather = ({ capital }) => {
  const [weather, setWeather] = useState(null);

  useEffect(() => {
    console.log("useEffect called");
    const getWeather = async () => {
      try {
        const res = await axios.get(
          `http://api.apixu.com/v1/current.json?key=53d601eb03d1412c9c004840192807&q=${capital}`
        );
        setWeather(res.data); …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks use-effect

5
推荐指数
1
解决办法
2万
查看次数

使用 React Hooks 自动调整 iframe 的高度

我一直致力于自动调整 iframe 高度。

该问题的解决方案在 React Hooks 中不起作用。

我已经阅读了在ReactJS中将iframe高度设置为scrollHeight调整iframe的宽度和高度以适应其中的内容。我已经探索了更多的帖子,并在近一周的时间里尝试了几次。但是,我还没有找到正确的方法来解决这个问题。

我简化了我所尝试的。我的代码

除了我的代码之外,我也尝试过iframeResizer.min.js,但它不起作用。我相信这是因为反应是动态生成的。我发现iframe-resizer-react并尝试过,但还没有找到解决问题的方法。

有人可以有同样的情况吗?如何在 React Hooks 中自动调整 iframe 高度?

html javascript iframe reactjs react-hooks

3
推荐指数
1
解决办法
2万
查看次数