小编Ndx*_*Ndx的帖子

useState 钩子一次只能设置一个对象,并将同一数组的另一个对象返回到初始状态

我有这种形式的数据:

books = [{
    id: 1,
    name: "book-1",
    audiences: [
      {
        audienceId: 1,
        name: "Cat A",
        critics: [
          { id: 5, name: "Jack" },
          { id: 45, name: "Mike" },
          { id: 32, name: "Amanda" }
        ],
        readers: [
          { id: 11, fullName: "Mike Ross" },
          { id: 76, fullName: "Natalie J" },
          { id: 34, fullName: "Harvey Spectre" }
        ]
      }]
Run Code Online (Sandbox Code Playgroud)

表格是嵌套的。对于每本书,都有评论家和读者,并且会根据 AudienceId 值呈现每种形式

<div className="App">
      {books.map((book, index) => (
        <div key={book.id}>
          <h1>Books {index + 1}</h1>
          {book.audiences.map((au) => ( …
Run Code Online (Sandbox Code Playgroud)

state reactjs react-hooks use-state

8
推荐指数
1
解决办法
163
查看次数

如何使用 sinon/mocha 模拟 npm 模块

我正在尝试测试一个调用 module 的函数cors。我想测试那个cors会被调用。为此,我必须存根/模拟它。

这是函数 cors.js

const cors = require("cors");

const setCors = () => cors({origin: 'http//localhost:3000'});
module.exports = { setCors }
Run Code Online (Sandbox Code Playgroud)

我测试此类功能的想法类似于

cors.test.js

  describe("setCors", () => {
    it("should call cors", () => {
      sinon.stub(cors)

      setCors();
      expect(cors).to.have.been.calledOnce;

    });
  });
Run Code Online (Sandbox Code Playgroud)

知道如何存根 npm 模块吗?

mocking mocha.js node.js sinon sinon-chai

7
推荐指数
1
解决办法
7041
查看次数

刷新后React App返回错误

我正在使用React Router v4创建一个React/Redux应用程序.它有一个简单的架构

--RootPage    path /
 --HomePage   path /h
   -Gallery   path /h/portfolio
   -Links     path /h/links
   -About     path /h/about
Run Code Online (Sandbox Code Playgroud)

现在,每次刷新,如果我在二级/ h /组合,或/ h /链接,或/ h/about,这个错误net :: ERR_ABORTED.

在此输入图像描述

如果我在根级别或/ h /级别,刷新工作正常.我已经添加historyApiFallback: true到devServer所以它不是那个问题.每次刷新时都必须始终转到/ root是没有用的.这可能有什么问题?

这是我的路线

const mainRouter=(
    <Wrapper>
<Provider store={store} history={history}>
  <BrowserRouter>
      <div>
      <Route exact path="/" component={Home}/>
      <Route path="/h" component={HomePage}/>
       </div>
   </BrowserRouter>
    </Provider>
    </Wrapper>
  )
Run Code Online (Sandbox Code Playgroud)

并在HomePage

       <main>
          <Route path={`${this.props.match.path}/portfolio`}
          render={ ()=><Gallery {...this.props}/> } />
          <Route path={`${this.props.match.path}/about`} render={ ()=><About 
          {...this.props}/> }/>
          <Route path={`${this.props.match.path}/links`} render={ ()=><Links 
          {...this.props}/> }/>

      </main>
Run Code Online (Sandbox Code Playgroud)

reactjs redux react-router-v4

6
推荐指数
1
解决办法
1789
查看次数

导航到外部URL以做出反应

我正在使用React Router v4在React中使用此结构创建一个简单的应用程序

-Wrapper
 -Home /
 -Homepage /h
    --GalleryContainer  /h/gallery
       ---Gallery  /h/gallery
       ---Item    /h/gallery/:itemId
    --About /h/about
    --Links /h/links
Run Code Online (Sandbox Code Playgroud)

在“链接”中,有一个重定向到外部链接的元素列表。问题是,当您单击url时www.example.com,它转到http://localhost:7770/h/www.example.com并呈现404链接未找到

这是代码

<div className="links">
        <ul>
          {link.links.map((url,i)=>
            <li key={i}><a href={url}>{url}</a></li>)}
        </ul>
      </div>
Run Code Online (Sandbox Code Playgroud)

网址为www.example.com或任何网站链接。

你如何使URL去www.example.com而不是http://localhost:7770/h/www.example.com

reactjs react-router-v4

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

如何使用api的数据初始化状态

我正在创建一个从 api (pokeapi.co) 获取数据的 React/Redux 应用程序。我使用axios. 当我在 react 组件上显示数据时,会导致数据为undefined. 经过一番挖掘,我发现我的状态首先返回初始状态,即空对象,然后返回 api 数据。但它不会在反应中显示。我是 React 的新手,所以我猜它与 axios 异步功能有关。您如何使用 api 的初始数据设置状态或等待呈现数据直到状态具有 api 的数据?

这是减速机

function pokemonReducer(state={}, action) {
    switch (action.type) {
        case pokemonsActions.GET_POKEMON_SUCCESS:
            {
                return  {...state, data: action.payload.data}
            }

        default:
            {
                return state;
            }
    }
}

export default pokemonReducer
Run Code Online (Sandbox Code Playgroud)

这是动作

export const GET_POKEMON_SUCCESS = 'GET_POKEMON_SUCCESS'
export const GET_POKEMON_ERROR = 'GET_POKEMON_ERROR'

function getPokemonSuccess(response) {
    return {
        type: GET_POKEMON_SUCCESS,
        payload: response
    }

}

function getPokemonError(err) {
    return {
        type: GET_POKEMON_ERROR,
        payload: …
Run Code Online (Sandbox Code Playgroud)

api reactjs redux axios

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

将具有相同值的对象键分组

我有一个对象

var myObject = {"audi": "gas", "tesla": "electric", "bmw": "electric", "mercedes": "electric"}
Run Code Online (Sandbox Code Playgroud)

我想将所有具有相同值的键分组在一个字符串中,就像只使用 es5

tesla bmw mercedes: electric. audi: gas
Run Code Online (Sandbox Code Playgroud)

我使用了Object.keys和的组合,Object.values但对我不起作用

var res = ''
Object.keys(myObject).map(function(key) {
    Object.values(myObject).map(function(val) {
        if (myObject[key] === val) {
            kes = {
                [res.concat(key)]: val
            }
        }
    })
})
Run Code Online (Sandbox Code Playgroud)

javascript

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