小编cha*_*lee的帖子

在阅读redux文档时,我发现该文档提到了这一点:

不过,你应该尽力保持状态可序列化.不要在里面放任何你不能轻易变成JSON的东西.

所以我的问题是,保持状态可序列化有什么好处？或者,如果我将不可序列化的数据存储到存储中,我会遇到什么困难？

而且我相信这并不是redux-Flux所独有的,甚至React本地州也提出同样的建议.

让我明白这里是一个例子.假设商店结构是这样的.

{
    books: { 
        1: { id: 1, name: "Book 1", author_id: 4 }
    },
    authors: {
        4: { id: 4, name: "Author 4" }
    }
}

这一切看起来都不错.但是,当我尝试访问"Book 1的作者"时,我必须编写如下代码:

let book = store.getState().books[book_id];
let author = store.getState().authors[book.author_id];

现在,我要定义一个类:

class Book {
    getAuthor() {
        return store.getState().authors[this.author_id];
    }
}

我的商店将是:

{
    books: {
        1: Book(id=1, name="Book 1")
    },
    ...
}

这样我就可以通过以下方式轻松获得作者:

let author = store.getState().books[book_id].getAuthor();

第二种方法可以使"书"对象知道如何检索作者数据,因此调用者不需要知道书籍和作者之间的关系.那么,为什么我们不使用它,而不是像方法#1那样在商店中保留"普通对象"？

任何想法都表示赞赏.

我现在正在使用带有AngularJS 1.5组件的css-modules.堆栈是webpack+ css-loader?modules=true+ angular 1.5 components+ pug.

目前,我必须执行以下步骤才能在我的pug模板中使用css模块.

// my-component.js

import template from 'my-component.pug';
import styles from 'my-component.css';

class MyComponent {
    constructor($element) {
        $element.addClass('myComponent');        // ------ (1)
        this.styles = styles;                    // ------ (2)
    }
}

angular.module(name, deps)
    .component('my-component', {
        controller: MyComponent,
        template: template,
    });

// my-component.pug
div(class={{ ::$ctrl.styles.fooBar }}) FooBar    // ----- (3)

// my-component.css
.myComponent { background: green; }
.fooBar { color: red; }

有两个问题:

1. 每个组件都必须$element手动注入和设置其类名.这样做的原因是,AngularJS组件标签本身存在于没有任何类的结果HTML中,这使得CSS变得困难.例如,如果我MyComponent像上面这样使用:

   <div>
     <my-component></my-component>
   </div>
   

   Run Code Online (Sandbox Code Playgroud)

   它将生成以下HTML: …

我正在开发一个使用以下架构的 React 应用程序：

• redux
• typesafe-actions
• redux-observable

我的问题是：如何对特定的 redux 操作执行 UI 操作？

例如，假设我们定义了以下异步操作typesafe-actions：

export const listTodo = createAsyncAction(
  'TODO:LIST:REQUEST',
  'TODO:LIST:SUCCESS',
  'TODO:LIST:FAILURE',
)<void, Todo[], Error>();

Epic 将监视listTodo.request()并发送 API 调用，然后将响应转换为listTodo.success()操作。然后redux减速器将被listTodo.success()action触发并将todo列表存储到redux存储中。

在这种设置中，假设我想在组件中执行以下操作：

• 调度一个listTodo.request()动作来检索所有动作
• 异步请求完成后（即listTodo.success()操作出现在操作流中后），将 UI 重定向到第二个路径

所以我的问题是，我如何观看操作流并对操作做出反应listTodo.success()？

更新：为了避免过于具体，我们可以考虑另一种情况。我想简单地在操作流中出现window.alert()之后显示警报。listTodo.success()或者简单地console.log()，或者任何改变本地状态（而不是全局 redux 状态）的东西。有办法实现吗？

更新2：这里有一个类似的问题，但是对于带有ngrx的Angular。我想做的正是上面帖子中描述的事情，但是以 React / redux-observable 的方式：

import { Actions } from '@ngrx/effects';

@Component(...)
class SomeComponent implements OnDestroy {
    constructor(updates$: Actions) {
        updates$ …

我正在使用 nodejs、express 和node_redis构建一个应用程序。我想做一个模块来封装所有redis相关的操作，这样我就不用到处处理redis的key了。

|- app.js
|- models
|   |- db.js   <-- All redis-related operations here
.....

那么我这里有两个问题。

1. 我想创建 redis 连接并选择一个数据库：

   var redis = require('redis');
   var client = redis.createClient();
   client.select(config.database, function() {
       // actual db code
   });
   

   Run Code Online (Sandbox Code Playgroud)

   既然select是异步调用，我如何在单独的模块（db.js）中使用它？

2. 看起来client.quite()必须在脚本结束之前调用，否则脚本将不会退出。db.js当client封装为局部变量时，我该如何在外部执行此操作db.js？