小编Raf*_*des的帖子

当我测试<Link />行为，期望它重定向到某个路由时，出现了 TypeError ( Cannot read property 'push' of null)。

这是我当前正在测试的组件：

import React from "react"
import Link from "next/link"

const Sandbox = () => {
  return (
    <div>
      <Link href="/about">
        <a data-testid="mytest">Click Me</a>
      </Link>
    </div>
  )
}

export default Sandbox

这是我正在运行的测试：

import React from "react"
import { render, fireEvent } from "@testing-library/react"
import { useRouter } from "next/router"
import Sandbox from ".."

jest.mock("next/router", () => ({
  useRouter: jest.fn(),
}))

describe("Sandbox", () => {
  it.only("should navigate accordingly", () …

我的组件的状态是一个对象数组：

this.state = {
  userFavorites: [{id: 1, title: 'A'}, {id: 2, title: 'B'}]
}

每次单击按钮时，我都需要使用另一个对象更新我的状态，就像上面状态中的对象一样；例如：{id：3，标题：'C'}。

如果我只是将它们连接起来并设置状态，则最后一个对象会不断被添加的对象更改。

我这里需要展开运算符吗？

我想要一个带有两个输入的双范围滑块来控制范围。

就像这个：https : //i.stack.imgur.com/8w0UI.png

我还需要将它与 vue.js 一起使用。

我已经用 vue 1.0.19 完成了这个目标。

现在我想用 vue 2.5.13 做它，它根本不起作用。

我认为这是由于我的 javaScript 中的 ready 方法。

我已经尝试过创建和安装但没有成功。

我的javascript：

    var vue = new Vue({
    el: '#main',
    data: {
        minRange: null,
        maxRange: null,
        slider: {
            startMin: 25,
            startMax: 75,
            min: 0,
            max: 100,
            start: 40,
            step: 1
        },
        Slider: document.getElementById('slider')
    },
    methods: {
        updateSlider: function updateSlider() {
            this.Slider.noUiSlider.set([this.minRange, this.maxRange]);
        }
    },
    ready: function ready() {
        noUiSlider.create(this.Slider, {
            start: [this.slider.startMin, this.slider.startMax],
            step: this.slider.step,
            range: {
                'min': this.slider.min,
                'max': …