小编kon*_*oya的帖子

我正在尝试使用自定义对话框询问用户确认,然后导航未保存的数据.

按照我的文档:

  componentDidMount() {
      this.props.router.setRouteLeaveHook(
        this.props.route,
        this.routerWillLeave
      )
  }

而不是

  routerWillLeave(nextLocation) {
    if (!this.props.pristine) {
      return 'You have unsaved information, are you sure you want to leave this page?'

    }

我有

  routerWillLeave(nextLocation) {
    if (!this.props.pristine) {
        this.setState({open: true})
        this.forceUpdatate() //necessary or else render won't be called to open dialog
    }

我使用的对话框组件来自材料的UI刚刚期望一个open布尔值来控制对话框,这还需要handleCancel和handleContinue方法,但我不知道如何与它挂起来routerWillLeave.

该handleCancel方法很简单,只需关闭对话框:

  handleCancel() {
    this.setState({open: false})
  };

我已将对话框组件包装在名为的组件中 Notification

export default class Notification extends React.Component { …

我正在使用以下获取 API 来获取 API 结果。我需要在状态中设置结果数据，但“this”对象在回调函数中不可用。如何通过访问this关键字更新代码以设置状态中的值？

fetch(config.apiUrl + '/api/user', {
  headers: authHeader(),
  method: 'GET',
})
  .then(function(res) {
    return res.json();
  })
  .then(function(data) {
    this.setState({ id: data.id });
  });

我正在使用 Jest 为 Node.js 后端开发一些测试，我需要检查一些来自第三方的值。在某些情况下，这些值可以作为 aboolean或 作为null。

现在我正在检查适合这种情况的变量：

expect(`${variable}`).toMatch(/[null|true|false]/);

有没有更好的方法来使用 Jest 内置函数检查它们？

在我使用的应用程序中，有 4 行按钮，每行包含 3 个按钮。当我在 iPad 上使用相同的应用程序时，按钮的对齐方式变为 2 行，每行包含 6 个按钮。此外，按钮的宽度和高度会根据屏幕尺寸而变化。我希望我的应用程序具有相同的功能，但我不知道该怎么做。有什么帮助吗？

我无法弄清楚在 redux 商店中同时使用 devToolsExtension 和中间件的确切方法。

下面是我的 redux 商店代码。

import {createStore, combineReducers, applyMiddleware} from 'redux';
import thunk from 'redux-thunk';
import counterReducer from './../reducers/counterReducer';

const reducers = combineReducers({
    counter: counterReducer
});
const store = createStore(
    reducers, 
    {counter: {count:0} },
    // window.devToolsExtension && window.devToolsExtension(), 
    applyMiddleware(thunk)
);

export default store;

因为 createStore() 需要 3 个参数。在应用中间件 thunk 之前，我将它用作下面的代码，这对我来说很好用。

const store = createStore(
    reducers, 
    {counter: {count:0} },
    window.devToolsExtension && window.devToolsExtension()
);

现在，我需要使用 devToolsExtension 并同时应用中间件。

我试图将 devToolsExtension 和 applyMiddleware 放在数组中，以便它充当第三个参数，但这不起作用。

const store = createStore(
    reducers, 
    {counter: {count:0} …

在经过Jest测试的项目中，我有*.entity.ts文件。我不希望这些文件包含在覆盖测试中。

根据在文档https://facebook.github.io/jest/docs/en/configuration.html#coveragepathignorepatterns-array-string有一个coveragePathIgnorePatterns，你可以在使用设置package.json

我已经尝试过正则表达式和文件模式，但是这些都不会忽略*.entity.ts最终报告中的文件。

例如，当我添加时，"coveragePathIgnorePatterns": ["common"]我的测试将不再运行。

关于如何使Jest跳过*.entity.ts覆盖测试的任何想法？

package.json中的“我的笑话”部分如下所示：

{
    "moduleFileExtensions": [
        "js",
        "json",
        "ts"
    ],
    "rootDir": "src",
    "testRegex": ".spec.ts$",
    "transform": {
        "^.+\\.(t|j)s$": "ts-jest"
    },
    "coverageDirectory": "../coverage"
}

我正在尝试使用 redux 从数组中添加/删除项目，这些项目将添加到数组中，但是当我尝试删除一个项目时，它看起来像是在改变数组并添加项目而不是删除

尝试添加/删除项目后，我的状态看起来与此类似

[item1, item2, [item1, item2]]

如何从数组中删除项目？

状态

state.filtered.cities: []

过滤器.js

import React from 'react'
import styled from 'styled-components'
import { connect } from 'react-redux'
import * as actions from './actions'

class Filter extends React.Component {

  handlecity = (city) => {
    this.props.addCity(city)
  }

  handleRemoveCity = (city) => {
    this.props.removeCity(city)
  }



  render() {

    const options = [
   'item1','item2'
    ]

    return(
      <Wrap>
        {options.map((option,index) =>
          <Cell>
            <OptionWrap key={index} onClick={()=> this.handlecity(option)}>
              {option}
            </OptionWrap>
            <OptionWrap key={index} onClick={()=> this.handleRemoveCity(option)}>
              remove {option}
            </OptionWrap>
            {console.log(this.props.city && …

如果您已登录，赛普拉斯是否有可能从页面注销？或者检查我是否登录？

我的问题是，如果我在浏览器中运行一个测试，那么 Cypress 总是需要登录。但是如果我从 cmd 启动它，它只需要在第一个测试中登录，但在下一个测试中你已经登录了。

// Visit the site
cy.visit(
  "https://zeteodemo.uat.creasoft.cz/login?ReturnUrl=%2fVehicleInsuranceV2%2fCompare%3fOsobniCislo1%3d1%26ProductsFilter%3dAXA-ONLINE"
);

// Enter username
cy.get(".login__username")
  .type("tester")
  .should("have.value", "tester");

// Enter password
cy.get(".login__password")
  .type("1")
  .should("have.value", "1");

// Click the login button
cy.get(".button-login").click();

我在我的反应应用程序上使用 axios 发送删除请求，我需要发送一个 id 列表作为有效负载，但它返回“415 Unsupported Media Type”。

这是我的代码：

const deviceData = ["31234"];

axios.delete(url, { data: deviceData }).then(res => {
  if (res.status === 200) {
    const pagination = { ...this.state.pagination };
    this.setState({
      loading: false,
      data: res.data.data.devices,
      pagination
    });
  }
});

当我运行命令 npx cypress open cypress 窗口已启动，但由于某种原因 UI 不可见我尝试过 npm install cypress@latest --save-dev，但它仍然无法工作 Cypress 版本：Cypress 软件包版本：10.3 .1 Cypress 二进制版本：10.3.1 Electron 版本：18.3.0 捆绑节点版本：16.13.2 节点版本：v16.14.0