小编Tho*_*Byy的帖子

cy.intercept 不是 Cypress 测试的函数

我正在从 Cypress 文档复制代码并返回此错误 cy.intercept is not a function

在此处输入图片说明

我的代码直接来自文档...

describe('My First Test', () => {
  it('Visit Home Page', () => {
      cy.intercept('search/*', [{ item: 'Book 1' }, { item: 'Book 2' }]).as('getSearch')
  }
})
Run Code Online (Sandbox Code Playgroud)

不知道为什么会发生这种情况?

testing cypress

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

将 react-charts 功能组件示例转换为类组件

嘿,我在尝试将这个示例实现到我的 React 项目时遇到了很多麻烦。该示例与我的设置方式不同,我无法将其从他们的方式转换为我的方式。我有一个图表,但我真的希望包含渐变颜色。这就是我所得到的......

import React from 'react'
import { Chart } from 'react-charts'

class GraphClub extends React.Component {
  constructor(props) {
    super(props)

    this.state = {
      chartData: [
        {
          label: 'Won',
          data: [
            [0, 0],
          ],
        },
      ],
    }
  }


  componentDidMount() {
      //Get chartData
  }

  render() {
    return (
      <>
        <Chart
          data={this.state.chartData}
          axes={[
            {
              primary: true,
              type: 'linear',
              position: 'bottom',
              show: this.props.axis,
            },
            {
              type: 'linear',
              position: 'left',
              show: this.props.axis,
            },
          ]}
          series={{ type: 'line', showPoints: false }}
          tooltip
        /> …
Run Code Online (Sandbox Code Playgroud)

class reactjs react-charts

6
推荐指数
2
解决办法
154
查看次数

Next JS 中找不到自定义 [slug] 时重定向到 404

我很惊讶我无论如何也找不到这个,但这是我的问题。我有一个 Next JS 站点,其路径/location/[location].js 为该页面看起来非常基本

import { nodes } from '../../components/data/nodes'

export default function Location() {
    const router = useRouter()

    useEffect(() => {
         //Do various things   
    }, [])
   
    return (
        <Layout>
             ...My website...
        </Layout>
    )
}
Run Code Online (Sandbox Code Playgroud)

节点看起来像这样

export const nodes = [
{
    id: 'Test1'
}, {
    id: 'Test2'
}, {
    id: 'Test3'
}]
Run Code Online (Sandbox Code Playgroud)

那么,如果我的 [location] slug 与任何节点 id 都不匹配,我该怎么说才能转到 404 页面呢?我尝试了一些简单的垃圾,但感觉不对并抛出控制台错误:

var counter = 1
  for (var node of nodes) {
    if (router.query.location == node.id) {
      break
    } …
Run Code Online (Sandbox Code Playgroud)

custom-error-pages next.js

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

赛普拉斯while循环

我有一个 API 可以返回一天中的时间,如果这些时间都被占用了,那么它不会返回任何时间。我想搬到第二天并尝试检查那里的时间,但我的测试卡住了并且会崩溃。

因此,如果没有时间,请转到第二天并等待响应并再次检查时间。如果有时间返回,我们可以退出循环。任何人都看到这是哪里出了问题?

谢谢

cy.get('body').then(($body) => {
  while (true) {
    if ($body.find('.time').length) {
      break
    } else {
      cy.get('.day').eq(4).click()
      cy.wait('@apiCheck2')
      cy.wait(500)
    }
  }
})
Run Code Online (Sandbox Code Playgroud)

reactjs cypress

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

在 React Hook Forms 7 中共享引用使用两次

我希望我已经接近将旧的 React hook 表单转换为 RHF7,但我一直试图用 2 个不同的输入来共享 refs 两次。有人可以帮我完成这段代码吗...所以我需要在 dobMonth 和 dobYear 上都有一个引用,但我不能使用同一个引用两次,所以我需要创建第二个引用,但它不允许我这样做。

  const dobMonthInput = useRef(null)
  const dobYearInput = useRef(null)

  const {
    register
  } = useForm()

  const { ref, ...rest } = register('dobMonth', {
    required: true,
    validate: (value) => validateDate(value, getValues),
    onChange: (e) => onChange(e),
  })
  /*const { ref, ...rest } = register('dobYear', {
    required: true,
    validate: (value) => validateDate(value, getValues),
    onChange: (e) => onChange(e),
  })*/


  ....



  <input
        name="dobDay"
        type="text"
        {...register('dobDay', {
            required: true,
            validate: (value) => validateDate(value, getValues), …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

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

使用 Material UI 嵌套主题

我的网站上有许多数据表,而且大多数情况下它们的样式都相同。我需要将几种不同的样式应用于其中一些样式。我想创建一个全局主题来处理整个站点的所有内容,包括基本的数据表样式,我还希望有一个本地主题来稍微调整单个数据表。这是我所拥有的。

https://codesandbox.io/embed/jolly-antonelli-fg1y1

这是这样的结构

    <Test>
        <PrimaryThemeHere> //All have Border 1px red
            <TestChild>
                <SecondaryThemeHere> //blue background
                    <Datatable />
                </SecondaryThemeHere>
            </TestChild>
            <TestChild2>
                <SecondaryThemeHere> //Red background
                    <Datatable />
                </SecondaryThemeHere>
            <TestChild2>
        </PrimaryThemeHere>
    </Test>
Run Code Online (Sandbox Code Playgroud)

主要主题如下所示:

const theme = createMuiTheme({
  overrides: {
    MuiTableBody: {
      root: {
        border: "1px solid red"
      }
    },
    MuiTableCell: {
      root: {
        border: "1px solid red"
      }
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

嵌套主题如下所示:

  getMuiTheme = () =>
    createMuiTheme({
      overrides: {
        MuiTableRow: {
          root: {
            backgroundColor: "blue"
          }
        }
      }
    });
Run Code Online (Sandbox Code Playgroud)

我永远无法让红色边框与背景颜色一起显示。它总是选择其中之一。如何获得初始主主题(边框 1px 红色)和背景颜色或蓝色和红色的组合。

请帮忙

themes reactjs material-ui

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

返回 React Native 应用程序时调用函数

我有一个使用此代码的应用程序:Linking.openURL('google.navigation:q='+latitude+'+'+longitude)在我的 React Native Expo 应用程序中退出到谷歌地图。对于 Android(和 iOS),您可以使用手机的后退按钮返回到之前的应用程序。我想知道当我的应用程序重新出现时如何调用函数。我的应用程序中有一些 GPS 数据,我希望在它们移动到某个位置后一旦返回我的应用程序就重新更新我的数据。我找到了这个....

componentWillMount() {
    const { navigation } = this.props;
    this.focusListener = navigation.addListener('didFocus', () => {
       // The screen is focused
       // Call any action
    });
}
Run Code Online (Sandbox Code Playgroud)

但当我从地图回来时它似乎没有打电话..,

这是接近还是我做的完全错误?

谢谢

reactjs react-native expo

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

Next JS Framer 运动淡出

我正在尝试使用 framer-motion 和 Next js 创建淡入淡出效果,但它永远不会淡出。我知道AnimatePresence allows components to animate out when they're removed from the React tree.这可能是我的问题,但我不知道反应不够好,不知道如何修复我的结构。谁能推荐一种让它消失的方法吗?这是一些页面...

_app.js

export default class BookingApp extends App {
render() {
return (
    <Provider session={pageProps.session}>
      <ThemeProvider theme={myTheme}>
        <GlobalStyles />
          <Layout>
            <AnimatePresence exitBeforeEnter>
              <Component {...pageProps} key={router.route} />
            </AnimatePresence>
          </Layout>
      </ThemeProvider>
    </Provider>
)
}}
Run Code Online (Sandbox Code Playgroud)

一些简单的页面

class TestPage extends React.Component {
render () {
return <motion.div 
  exit={{ opacity:0 }}
  initial={{ opacity:0 }}
  animate={{ opacity:1 }}
>
  {resultsList}
</motion.div>;
}}
Run Code Online (Sandbox Code Playgroud)

next.js framer-motion

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

删除卡在 Git Push 上的大文件

我有一个独特的情况,我添加了 2 个 >50MB 的文件,但 Git 无法处理它们。我已经提交了它们并尝试推动,但它出错并说它太大了。现在我可以解决这个问题,但现在我已经在添加我想保留的文件的同时和之后进行了更改。所以现在我有 8 个提交准备好推送,一旦我可以摆脱大文件并让它再次工作。

我用过git rm --cached largefile.whatever,看不到大文件,git diff --stat --cached origin/master但是当我推送时,它仍然推送20分钟,然后说文件太大。

我还删除了大文件并推送了删除,但仍然存在同样的问题。

我想保留所有最近的工作,但删除大文件并继续。我怎样才能做到这一点?

这是我的提交过程。我希望回去也能那么容易,但我现在给自己挖了一个坑。我对 git 不是最擅长,所以我希望这是有道理的。

我不能git rm,因为该文件已被删除。它没有显示在目录中并说myfile.tif did not match any files

git 日志

git push

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