标签: flux

我试图得到flummox和react-router协同工作的测试示例(免责声明:学习,为愚蠢的问题道歉).

我在这里找到了一些简洁的例子https://github.com/olegsmetanin/react_react-router_flummox_example但是它使用了不赞成React.withContext来启动应用程序(来自index.jsx):

  React.withContext(
    { flux },
    () => React.render(<Handler />, document.getElementById(divid))
    );

Flummox现在有一个<FluxComponent/>可以用来设置上下文,但我似乎无法让它与一个react-router.

如果我这样做:

router.run((Handler, state) => {
    React.render(
            <FluxComponent flux={flux}>
                <Handler {...state}  />
            </FluxComponent>, 
            document.getElementById('app'));
});

我的处理程序似乎没有在其上下文中获得通量(并在控制台中抛出警告,因为它已丢失).

感觉就像我在这里错过了一个重要的难题,但找不到具体的例子(我可以找到旧的flummox/react/react-router示例或新的flummox/react但不使用react-router).

有什么建议？

当新成员登录时，我使用 Reactjs 来填充state.users 。

以下代码正在运行

var users = this.state.users;
users.push(member);
this.setState({users: users});

但是当我尝试将所有内容包装在一行代码中时，它失败了

this.setState({users: this.users.state.push(member)});

当我尝试上述操作时，我的 list.jsx 中出现错误

未捕获的类型错误：this.props.users.map 不是函数

知道是什么原因造成的吗？我在想，当我使用单行解决方案时，错误类型的对象被传递到状态中？

谢谢你！

我有一个React + Flux应用程序并使用Webpack.我正在使用的REST API由不同的服务器提供服务,我试图找出我可以指定后端端点常量的位置,具体取决于我是在dev或prod环境中.

目前,对于dev,我已经将URL编码为localhost:port,但是当我部署时,它仍然尝试访问localhost上的端点.

它似乎应该是非常常见的东西,但找不到任何信息.

用字母 T 为类型添加前缀似乎是一种常见的模式。

这是一些通量代码的示例：

  declare class ReduceStore<TPayload, TState> extends Store<TPayload> {
    getState(): TState;
    getInitialState(): TState;
    reduce(state: TState, action: TPayload): TState;
    areEqual(one: TState, two: TState): boolean;
  }

这个图案有什么用？State 类型和 TState 类型有什么区别？为什么不需要在任何地方导入或定义 TState，这是一个打字稿原语吗？

有没有办法合并多个错误信号？例如：

    return Mono.zipDelayError(
        monoOne(), //throws ValidationException with list of validation details 1
        monoTwo(),
        monoThree() //throws ValidationException with list of validation details 2
    )
    .then();
}

因此，我想返回 ValidationException 以及合并的验证详细信息列表

这是我的情况,我很反应/变化,并开始玩它.我的玩具项目是一个简单的图书馆应用.我目前的状况如下:

• 我有一个名为Login的组件.该组件仅负责存储当前"登录"的用户,以便能够处理库中的后一个借/返按钮.因此,用户输入其名称,此名称将保存到会话存储中.
• 我的另一个组件名为Library,它包含我的应用程序的主要逻辑.

如果我改变当前用户,我很难找到如何重新渲染我的库组件.从我的第一个项目开始,我不想使用正确的身份验证或创建路由器.所以我只做了一个Login表单,每当用户输入他的名字并登录时,我就会将库应用程序渲染到DOM上.

Login = React.createClass({

  _handleSubmit: function () {

    var inp = this.refs.login.getDOMNode();

    sessionStorage.setItem("username", inp.value);
    console.info('User Credentials saved to SessionStorage');
    inp.value = '';

    React.renderComponent(
      <Library />,
      document.querySelector('#content')
    );
  },

  render: function () {
    return (
      <div className="panel panel-default">
        blabla
                  <button className="btn btn-default" type="button" onClick={this._handleSubmit} >
                    Login
                  </button>
        blabla
      </div>
    );
  }
});

这很好用,但我认为它远非一种最佳方法.每当我再次登录时,react都会将一个新实例从Library组件重新呈现到DOM节点中.我根本不打算解构,我认为这很糟糕:(我知道反应不会附加,但擦除并填充到节点中,但事件处理程序可能会保留等等.

那么对于我的情况,什么可能是一个很好的解决方案？

我脑子里有3个可能的解决方案

1. 要么我应该开发一个事件系统,以便能够在我与另一个用户重新登录以重新渲染自身时通知Library组件,或者
2. 我可以在Login&Library上建立父子关系,所以当我修改Login组件的状态时,我的Library应用程序也会重新渲染.
3. 调用将更新组件的Action
4. 坚持当前

:)谢谢你的回答,干杯

暗示:

app.js

'use strict';
var React = require('react'),
    Login = require('./components/Login.jsx');

// Dev-tools
window.React = React;

React.renderComponent(
  Login(), …

AARGH!我的TYPO3 6.2.11工作很好!然后我更新了所有我的FLUIDTYPO3-Extensions,现在我会收到一个错误:

Could not analyse class:FluidTYPO3\Flux\ViewHelpers\Flexform\SheetViewHelper maybe not loaded or no autoloader?

这是更改日志,但对我来说没有明显的问题？FluidTYPO3:

flux 7.1.2 => 7.2.0
fluidcontent_core 1.0.3 => 1.1.0
fluidcontent 4.1.1 => 4.1.2
fluidpages 3.1.2 => 3.2.0
vhs 2.3.0 => 2.3.1

我在所有模板和FLUX-FCE上更改了我的命名空间,xmlns:f但这无济于事.从

xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers"

至

<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
     xmlns:f="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
     f:schemaLocation="https://fluidtypo3.org/schemas/fluid-master.xsd"
     xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers"
     flux:schemaLocation="https://fluidtypo3.org/schemas/flux-master.xsd">

没有.

这是一场灾难...我的网站因此错误而崩溃.我希望有人可以帮助我...(永远不要在晚上10点以后更新;)

我目前有一个非常简单的React应用程序,它使用state来确定几个视图.单击submit元素将触发对通过登录或注册凭据的端点的简单调用.我可以继续沿着这条路走下去,使用从服务器返回的React和JSON来确定我的观点,但我知道处理数据的方式并不合适.

我的问题是,从这里开始,如何使用Flummox实现Flux模式？我是否使用有效负载触发操作并在操作或商店中进行API调用？我正在尝试理解从我的UI中的动作到我的API调用进行此往返的正确方法,以获取响应和UI响应商店的更改.

下面是我的Auth组件的代码.我想看一个如何在这种情况下使用Flummox的示例,这样我就可以理解扩展和添加功能所需的内容.

Auth.jsx

'use strict';

var React  = require('react');
var request = require('request');

var Auth = React.createClass({

  getInitialState: function() {
    return {
      name: '',
      email: '',
      pass: '',
      passConfirm: '',
      login: true,
      register: false
    };
  },

  handleLogin: function(){
    this.setState({
      login: true,
      register: false
    });
  },

  handleRegister: function(){
    this.setState({
      register: true,
      login: false
    });
  },

  handleName: function(event){
    this.setState({
      name: event.target.value
    });
  },

  handleEmail: function(event){
    this.setState({
      email: event.target.value
    });
  },

  handlePass: function(event){
    this.setState({
      pass: event.target.value
    });
  },

  handlePassConfirm: function(event){
    this.setState({
      passConfirm: …

我有一个带有后端配置选项的扩展。我需要在 AddAction 和 UpdateAction 中验证电话号码。我可以在后端配置电话号码格式（例如美国电话号码/印度电话号码等）。我如何在验证器中获取设置？我有一个自定义验证器来验证电话号码。这是我的代码

    <?php
    namespace vendor\Validation\Validator;

    class UsphonenumberValidator extends \TYPO3\CMS\Extbase\Validation\Validator\AbstractValidator
    {   


         protected $supportedOptions = array(
               'pattern' => '/^([\(]{1}[0-9]{3}[\)]{1}[ ]{1}[0-9]{3}[\-]{1}[0-9]{4})$/'
          );


          public function isValid($property) { 
                $settings = $this->settings['phone'];
                $pattern = $this->supportedOptions['pattern'];
                $match = preg_match($pattern, $property);

                if ($match >= 1) {
                    return TRUE;
                } else {
                $this->addError('Phone number you are entered is not valid.', 1451318887);
                    return FALSE;
                }

    }
} 

$settings 返回 null

将非异步状态放在redux存储中有什么意义？例如,你有一个模态,显示或没有显示,你想写这么多只是为了切换？将它作为本地状态放在react组件中,并使用setState更新它有什么问题？

我决定哪个州应该通过redux的经验法则是数据是异步的,否则商店里会有这么多的ui状态,有一天它会变得如此之大,你的想法是什么？