小编Liu*_*hen的帖子

使用React Router重定向页面的最佳方法是什么？

我是React Router的新手,了解到有很多方法可以重定向页面:

运用 browserHistory.push("/path")

import { browserHistory } from 'react-router';
//do something...
browserHistory.push("/path");

Run Code Online (Sandbox Code Playgroud)

运用 this.context.router.push("/path")

class Foo extends React.Component {
    constructor(props, context) {
        super(props, context);
        //do something...
    }
    redirect() {
        this.context.router.push("/path")
    }
}

Foo.contextTypes = {
    router: React.PropTypes.object
}

Run Code Online (Sandbox Code Playgroud)

在React Router v4中,有this.context.history.push("/path")和this.props.history.push("/path").详细信息:如何在React Router v4中推送到历史记录？

我对所有这些选项感到困惑,有没有最好的方法来重定向页面？

reactjs react-router redux

Liu*_*hen

2017 07-14

68
推荐指数

3
解决办法

11万
查看次数

编写酶测试时何时使用“ Component.WrappedComponent”

我正在尝试做的是：

我正在尝试shallow通过以下模式使用酶的渲染，该模式适用于项目中的许多其他组件。

describe('>> MyComponent - Render', () => {
  let wrapper;
  beforeEach(() => {
    wrapper = shallow(<MyComponent.WrappedComponent
      actions={{}}
      history={}
    />);
  });

  it("test something", () => { expect(wrapper).toEqual(1); });

});

Run Code Online (Sandbox Code Playgroud)

我有什么问题：

我收到一条错误消息：“ 无法读取未定义的属性'contextTypes' ”，wrapper即为undefined。但是当我更改<MyComponent.WrappedComponent />为just时<MyComponent />，测试成功。这是我的代码：

describe('>> Legends - render', () => {
  let wrapper;

  beforeEach(() => {
    wrapper = shallow(<Legends textsAndColor={[]} />);
  });

  it('+++ render the component', () => {
    expect(wrapper.length).toEqual(1);
  });

  it('+++ match snapshot', () => {
    expect(wrapper).toMatchSnapshot();
  }); …

Run Code Online (Sandbox Code Playgroud)

reactjs redux enzyme

Liu*_*hen

lucky-day

6
推荐指数

1
解决办法

5285
查看次数

具有 POJO 的 anyOf 字段的 Json 架构

我想知道为具有“anyOf”字段的 Json 模式生成 POJO 的推荐方法是什么？

例如，给定以下 json 模式：

爱好.json

{
    "anyOf": [
        { "type": {"$ref": "./exercise.json" } },
        { "type": {"$ref": "./music.json" } }
    ]    
}

Run Code Online (Sandbox Code Playgroud) 练习.json

{
    "type": "object"
    "properties" {
        "hobbyType": {"type": "string"}
        "exerciseName": { "type": "string" },
        "timeSpent": { "type": "number" },
        "place": { "type": "string" }
    }
}

Run Code Online (Sandbox Code Playgroud) 音乐.json

{
    "type": "object"
    "properties" {
        "hobbyType": {"type": "string"}
        "instrument": { "type": "string" },
        "timeSpent": { "type": "number" }
    }
}

Run Code Online (Sandbox Code Playgroud)

我如何为Hobby.javaJackson 生成 POJO？

java pojo jsonschema jackson jsonschema2pojo

Liu*_*hen

2020 08-12

5
推荐指数

1
解决办法

4375
查看次数

如何使用 Vim 查看 zst 文件？

我正在尝试查看一些 zst 格式的日志文件。我可以用来zstdcat查看内容，但是当我这样做时vim <filename.zst>，只有乱码文本。有没有类似的方法zstdcat用 Vim 查看 zst 文件？

vim zstd

Liu*_*hen

lucky-day

5
推荐指数

1
解决办法

2万
查看次数

为什么我必须添加"overflow:hidden"才能在页面上显示导航栏？

我是css的新手,并且整个上午一直在努力解决我的代码的以下问题.如果有人能帮助我找出原因,我将非常感激.

如果我没有将"ul.navBar"的"溢出"设置为"隐藏",为什么导航栏会从页面中完全消失？

<html>
<head>
<style>
    ul.navBar {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        background-color: #4277f4;
        cursor: pointer;
    }

    li {
        float: left;
    }

    li a {
        display: inline-block;
        color: white;
        text-align: center;
        padding: 14px 16px;
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-size: 20px;
        text-decoration: none;
    }

    li:hover {
        background-color: #A2AEB3;
    }

    .dropDownContent {
        display: none;
        position: absolute;
        background-color: #7DC9E3;
        width: 150px;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        z-index: 1;
        text-decoration: none;

    }
    .dropDownContent a {
        color: …

Run Code Online (Sandbox Code Playgroud)

css

Liu*_*hen

lucky-day

3
推荐指数

2
解决办法

5142
查看次数

如何向前而不是向后添加文本

我想在每行的前面对齐一组行标题.但是行的位置将根据标题的长度而改变.所以我想如果我可以向前而不是向后增加文本的长度,我可以解决这个问题.但我不知道该怎么做.任何帮助表示赞赏!

这是我的HTML:

<div>
  <span class="title">1</span>
  <a href="#" class="cells">one</a>
  <a href="#" class="cells">two</a>
  <a href="#" class="cells">three</a>
  <a href="#" class="cells">four</a>
  <a href="#" class="cells">five</a>
</div>
<div>
  <span class="title">100</span>
  <a href="#" class="cells">one</a>
  <a href="#" class="cells">two</a>
  <a href="#" class="cells">three</a>
  <a href="#" class="cells">four</a>
  <a href="#" class="cells">five</a>
</div>

Run Code Online (Sandbox Code Playgroud)

无论标题的长度如何,我希望它看起来像:

它现在看起来像什么:

这是一个工作样本.

html javascript css

Liu*_*hen

lucky-day

2
推荐指数

1
解决办法

47
查看次数

以箭头函数格式使用react的生命周期方法的优缺点

我正在使用公共类字段语法(handler = () => {...})来定义我的所有React组件的事件处理程序,以便我可以使用this我的组件而不将它们绑定在constructor.我想知道我可以使用这种语法来使用React生命周期方法吗？用componentWillMount这种方式说:componentWillMount = () => {...}

如果使用箭头函数定义react的生命周期方法有什么优缺点？

javascript reactjs

Liu*_*hen

2018 02-02

2
推荐指数

2
解决办法

1307
查看次数