小编use*_*212的帖子

无法在事件处理程序中访问React实例(this)

我在ES6中编写了一个简单的组件(使用BabelJS),并且函数this.setState不起作用.

典型的错误包括

无法读取未定义的属性'setState'

要么

this.setState不是函数

你知道为什么吗?这是代码:

import React from 'react'

class SomeClass extends React.Component {
  constructor(props) {
    super(props)
    this.state = {inputContent: 'startValue'}
  }

  sendContent(e) {
    console.log('sending input content '+React.findDOMNode(React.refs.someref).value)
  }

  changeContent(e) {
    this.setState({inputContent: e.target.value})
  } 

  render() {
    return (
      <div>
        <h4>The input form is here:</h4>
        Title: 
        <input type="text" ref="someref" value={this.inputContent} 
          onChange={this.changeContent} /> 
        <button onClick={this.sendContent}>Submit</button>
      </div>
    )
  }
}

export default SomeClass
Run Code Online (Sandbox Code Playgroud)

javascript ecmascript-6 reactjs babeljs

201
推荐指数
4
解决办法
6万
查看次数

制作我自己的框架并将其用作项目的上游

我是一名为客户制作网站的自由职业者.我有自己的基于React和Node的devstack.目前,当我开发一个新站点时,我只是复制我编写的最后一个项目并修改路由,页面等.当我添加一些新功能(更新webpack 1到2等等)时,我必须在每个项目中手动完成(或者我根本不做).

我想对此采取更专业的方法.你能向我推荐一些材料或态度吗?

我目前的目标是:使用我的devstack(框架)拥有一个repo(私有github并在验证后公开).每次我开始一个新项目时,我都会将它分叉(以便它保持为上游原点)并开始开发.每当我改变一些核心功能或添加我想要在其他项目中的东西时,我想以某种方式将其推送到devstack repo.我也可以手动将此代码复制到devstack,但我不想写两次,所以更好的方法会有所帮助.

我怎么能这样做,我的想法好吗?基本上,一些建议,如果它完全有意义,一些文章的链接将帮助我.谢谢.

git open-source

20
推荐指数
2
解决办法
305
查看次数

根据属性值从ImmutableJS List中删除对象

基于属性值从List中删除对象的最简单方法是什么?

我正在寻找相当于MongoDB的$ pull.

我的列表看起来像这样简单:

[{a: '1' , b: '1'},{a: '2' , b: '2'}]
Run Code Online (Sandbox Code Playgroud)

我想从数组中删除与属性的对象组为"1".在MongoDB中,我会这样做:

Model.update({_id: getCorrectParentObj},{ $pull: {listIDeleteFrom: { a: '1' } } },(err, result)=>{});
Run Code Online (Sandbox Code Playgroud)

如何使用ImmutableJS获得相同的结果?

javascript node.js immutable.js

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

ImmutableJS - 从Map中删除元素

我有一个这种结构的地图:

{
1: {},
2: {}
}
Run Code Online (Sandbox Code Playgroud)

我想从它中删除2:{}(当然 - 如果没有这个,则返回新的集合).我该怎么做?我试过这个,但有些不对劲:

 theFormerMap.deleteIn([],2) //[] should mean that it's right in the root of the map, and 2 is the name of the object I want to get rid of
Run Code Online (Sandbox Code Playgroud)

javascript immutable.js

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

Redux + ImmutableJS - 如何垃圾收集太大的商店?

我正在使用Redux和ImmutableJS.在我的SPA(非常复杂的管理系统)中,用户经常将大量数据加载到存储中(许多表的数千行).打开多个页面并在商店中存储过多数据后,应用程序变得非常慢,因为ImmutableJS商店甚至可以包含数百万个条目.

如何从商店"删除"某些内容,以便数据不会减慢应用程序的速度?我知道这将违背其主要原则,但你怎么解决呢?

使用具有例如jQuery的通用网站,这将非常简单.每次刷新页面时,所有不必要的内容都会被垃圾回收.因此,一个页面的2-3,000个条目就可以了,但是当打开一个新页面时,reducer会加载新数据,但旧的数据仍然被引用.

当然,我不想强​​迫用户重新加载页面.

javascript frontend reactjs immutable.js redux

11
推荐指数
2
解决办法
1178
查看次数

ImmutableJS - 更新列表中的值

我有这样的地图(在ImmutableJS中):

{arrayOfValues: [
  {one: {inside: 'first in array'}},
  {one: {inside: 'second in array'}}
]}
Run Code Online (Sandbox Code Playgroud)

我想更新"arrayOfValues"数组中第二个条目中的"inside"值.我该怎么做?这就是我现在所说的"Uncaught Error:invalid keyPath"

theMap.update('arrayOfValues',(list)=>{
  return list.setIn([1,'one','inside'],'updated value'); 
})
Run Code Online (Sandbox Code Playgroud)

我也直接尝试了这个并没有用:

theMap.setIn(['arrayOfValues',1,'one','inside'],'updated value');
Run Code Online (Sandbox Code Playgroud)

经过几个小时的寻找解决方案,我感谢任何帮助.谢谢.

javascript reactjs immutable.js

10
推荐指数
2
解决办法
9963
查看次数

SequelizeJS - 使用原始查询将 JSONB 插入 Postgres - 如何转义

我想插入一行 JSONB 内容作为原始查询。问题是我在插入任何“非平凡”JSON 对象的任何地方都会出错。

这些是我的原始 SQL 查询的示例:

所有这些错误:SequelizeBaseError:json 类型的输入语法无效

'INSERT INTO "sometable" ("id", "createdAt", "updatedAt", "custom_data") VALUES (DEFAULT, NOW(), NOW(), \'"{something:\"value\"}"\')';
'INSERT INTO "sometable" ("id", "createdAt", "updatedAt", "custom_data") VALUES (DEFAULT, NOW(), NOW(), \'"{\"aaa\":\"ss15\"}"\')';
Run Code Online (Sandbox Code Playgroud)

最后一个有效,但仅适用于整数值:

'INSERT INTO "sometable" ("id", "createdAt", "updatedAt", "custom_data") VALUES (DEFAULT, NOW(), NOW(), \'"{a:10}"\')';
Run Code Online (Sandbox Code Playgroud)

我已经尝试了很多可能的组合来转义类似 JSON 的字符串,甚至插入真正的 JS 对象,但没有任何效果。

postgresql node.js sequelize.js

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

ReactJS - 我应该使用类方法还是外部函数

假设我有一个ReactJS组件并想要在其中调用一些自定义函数,将此函数作为类方法,或者更确切地说是单独定义是否更好?(假设该函数只应在此组件中使用)

class OnwComponent extends React.Component {
  constructor() {
    super();
    this.doubledNumber = this.doubledNumber.bind(this);
  }
  doubledNumber(num) {
    return num * 2;
  }
  render() {
    return (
      <p>{doubledNumber(10)} or {this.doubledNumber(10)}? Pros and cons?
    );
  }
}

function doubledNumber(num) {
  return num * 2;
}
Run Code Online (Sandbox Code Playgroud)

reactjs

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

在 HOC 中访问 React 组件的功能

我正在为我的各种 React 组件构建一个高阶组件。在这个 HOC 中,我需要访问孩子的方法并调用它们。我该怎么做?

示例 HOC:

export default function withHOC(Component) {
  return class extends React.Component {
    constructor(props) {
      super(props);
    }

    componentDidMount() {
      if (Component.someFunction) {
          Component.someFunction()
      }
    }

    render() {
      return <Component {...this.props} />;
    }
  };
}
Run Code Online (Sandbox Code Playgroud)

示例组件:

class App extends React.Component {
  someFunction() {
    console.log("something done here, for example setState")
  }
  render() {
    return (
     <div></div>
    ); 
  }
}

// then it's used like this
export default withHOC(App)
Run Code Online (Sandbox Code Playgroud)

我知道在某些情况下,像这样解决它甚至可能没有意义,但例如框架 Next.js 可以用它的 getInitialProps 函数做类似的事情。

javascript inheritance reactjs

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