小编tan*_*y_k的帖子

在 Redux 状态下使用原型函数存储对象

在状态中存储类是否被认为是不好的做法?我读过状态应该是容易序列化的对象和类打破了这个约定。

我正在创建一个 Web 应用程序,它使用 React/Redux 和一组支持模型来收集用户的信息。

例如,我有以下模型:

class Person {
  constructor(params = {}) {
    this.firstName = params.firstName || '';
    this.lastName = params.lastName || '';
    this.gender = params.gender || '';
    this.dateOfBirth = params.dateOfBirth || '';
    this.stateOfResidence = params.stateOfResidence || '';
    this.email = params.email || '';
  }
  validateField(args) {
    // remove for brevity
  }
  valid(args) {
    // remove for brevity    
  }
}
Run Code Online (Sandbox Code Playgroud)

通过发出以下 actionCreator 将对象添加到存储中:

export function addPerson(args = {}) {
  return (dispatch) => {
    dispatch({
      type: 'ADD_PERSON',
      obj: new Person(args)
    }); …
Run Code Online (Sandbox Code Playgroud)

javascript state reactjs redux

11
推荐指数
1
解决办法
5179
查看次数

TypeScript 1.5,反射和装饰器

我想知道是否可以使用反射,更具体地说是关于装饰器,属性,参数或方法的类反射?

这是否可以使用反射器来获取装饰器中使用的信息?

如果有可能,我们该怎么做?另外,为什么我们不能这样做?

编辑:

我有一个应用程序,我使用装饰器,从serviceRegistry注入数据到名为@Inject的装饰器.

在这个应用程序中,我手动填写一个简单的服务注册表,如:

serviceRegistry.push(MyClass1)
serviceRegistry.push(MyClass2)
...
serviceRegistry.push(MyClass100)
Run Code Online (Sandbox Code Playgroud)

目的是能够在运行时使用@ToInject批注修饰的类填充此服务注册表.

这将允许我避免手动填写此注册表,并简单地自动完成此操作.

提前谢谢

typescript typescript1.5

9
推荐指数
1
解决办法
6294
查看次数

Google maps API:如何检查地址或位置是否有效?

这是我的问题:我有一个我正在尝试使用的网页autocomplete,非常非常基本:

<script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<script type="text/javascript">
    $(document).ready(function () {
        new google.maps.places.Autocomplete(
            document.getElementById('testtest'), {}
        );
</script>
Run Code Online (Sandbox Code Playgroud)

当用户发布表单时,在服务器端,我将获得一个文本值

" Pentagone, North Rotary Road, Arlington, Virginie, États-Unis"

所以.那么,在服务器端,有没有办法验证这个地址是好的,即问谷歌?

google-maps

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

如何在Microsoft IIS上使用react router(createBrowserHistory)来使路由工作?

我正在使用react-router(createBrowserHistory)作为我的反应应用程序.

以下是我的代码

var ReactDOM = require('react-dom') ;

var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var Link = ReactRouter.Link;
var browserHistory = require('react-router');
var createBrowserHistory = require('history/lib/createBrowserHistory');

var CL = require('./page1/1.jsx');
var Validation = require('./page3/3.jsx');
var Infos = require('./page4/4.jsx');
var Confirm = require('./page7/7.jsx');
var Upload = require('./page8/8.jsx');

module.exports = (

  <Router history={new createBrowserHistory()}> 
    <Route path='/' component={CL}></Route>                                                                                                                                     
    <Route path='/validation' component={Validation}></Route>                                                                                                                                     
    <Route path='/infos' component={Infos}></Route>                                                                                                                                     
    <Route path='/confirm' component={Confirm}></Route>                                                                                                                                     
    <Route path='/upload' component={Upload}></Route>                                                                                                                                     
  </Router>
)
Run Code Online (Sandbox Code Playgroud)

Wen在本地运行IIS,我在浏览器上访问localhost,我可以获得"CL"组件并在页面上显示,但是,如果我去/验证,我会得到

Failed to load resource: the …
Run Code Online (Sandbox Code Playgroud)

javascript iis reactjs react-router react-routing

9
推荐指数
3
解决办法
9567
查看次数

Uint8Array 到 JavaScript 中的图像

我有名为 frameBytes 的 Uint8Array。我已经用这段代码从这个字节数组中创建了 RGBA 值。

    for (var i = 0; i < frameBytes.length; i++) {
        imgData.data[4 * i] = frameBytes[i];// red
        imgData.data[4 * i + 1] = frameBytes[i]; // green
        imgData.data[4 * i + 2] = frameBytes[i];// blue
        imgData.data[4 * i + 3] = 255; // alpha 
    }
Run Code Online (Sandbox Code Playgroud)

然后我使用以下代码将此 GRBA 值显示到画布上。

var ctx = fingerFrame.getContext('2d');
var imgData = ctx.createImageData(fingerFrame.width, fingerFrame.height);
ctx.putImageData(imgData, 0, 0, 0, 0, fingerFrame.width, fingerFrame.height);
Run Code Online (Sandbox Code Playgroud)

在那之后,我曾经使用以下代码在画布中对图像标记进行图像处理:

 const img = document.getElementById('i');  
 img.src = fingerFrame.toDataURL(); 
Run Code Online (Sandbox Code Playgroud)

但我不想使用画布。我想直接在 Uint8Array 的图像标签中显示图像。我怎样才能做到这一点?任何帮助将不胜感激。

javascript base64 canvas image

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

AngularJS:扩展输入指令

我想知道,如果有可能,扩展Angular的输入指令?我想将一些监听器附加到页面上的所有输入字段.我认为你可以装饰现有的模块$provide.decorate,但我不知道如何使用指令(更确切地说是输入指令)来做到这一点.

那么,有人能推动我朝着正确的方向前进吗?一些例子?

编辑

这是我到目前为止的指令:

angular.module('onFocusBlur').
directive('onFocusBlur', ["$rootScope", function($rootScope) {
  return {
    restrict: "A",
    link: function(scope, elem, attrs) {
        elem.bind('focus',function() {
          scope.$apply(function() {
            $rootScope[attrs.onFocusBlur] = true;
          });
        });
        elem.bind('blur',function() {
          scope.$apply(function() {
            $rootScope[attrs.onFocusBlur] = false;
          });
        });
    }
  };
}]);
Run Code Online (Sandbox Code Playgroud)

在我看来,我可以将它添加到这样的输入字段:

<input type="email" ng-model="email" on-focus-blur="repositionNavBar">
Run Code Online (Sandbox Code Playgroud)

缺点是,对于每个输入字段,我必须在我的代码中手动附加此侦听器.因此,更改现有的输入指令以包含此侦听器将是有用的.

javascript angularjs

8
推荐指数
2
解决办法
6259
查看次数

验证 React 中的表单输入字段

<div className="form-group">
  <label className="col-sm-0 control-label"> Name : &nbsp; </label>
  <input
    type="text"
    value={this.state.UserName}
    onChange={this.handleChangeUserName}
    placeholder="Name"
    pattern="[A-Za-z]{3}"
    className="form-control"
  />
</div>
Run Code Online (Sandbox Code Playgroud)

嗨,我正在尝试使用模式验证来验证 React 中的表单输入字段。但它不起作用。我使用的验证很简单pattern="[A-Za-z]{3}".

请让我知道如何解决这个问题。将验证放在 React Bootstrap 组件中。

validation twitter-bootstrap reactjs

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

Rails - 使用功能测试测试JSON API

我只有一个简单的问题,但我找不到任何答案.

我的ruby on rails 3.2.2 appilcation有一个带有设计会话认证的JSON API.

我的问题是:如何使用功能测试或集成测试来测试此API - 是否有办法处理会话?

我没有前端,只有我可以做的API.POST.放.并使用JSON Body进行删除.

哪种测试方法是自动化的最佳方法?

示例创建新用户

发布www.exmaple.com/users

{
 "user":{
    "email" : "test@example.com",
    "password " : "mypass"
  }
}
Run Code Online (Sandbox Code Playgroud)

ruby testing unit-testing ruby-on-rails ruby-on-rails-3.1

7
推荐指数
1
解决办法
5449
查看次数

当$ destroy激活时,是否需要在指令上删除事件处理程序?

我已经看过很多指令性的例子,包括AngularUI团队的那些,他们似乎没有进行任何清理.

这是他们创建jQuery datepicker的ui-date指令的一个例子. (资源)

element.on('blur', function() { ... });
Run Code Online (Sandbox Code Playgroud)

他们在元素上放置了一个事件处理程序,但它们从来没有取消绑定事件.我原以为会有代码存在,例如:

var namespace = ".uiDate";

element.on('blur' + namespace, function() { ... });
element.on("$destroy" + namespace, function ()
{
   element.datepicker("destroy");      //Destroy datepicker widget
   element.off(namespace);             //Unbind events from this namespace
});
Run Code Online (Sandbox Code Playgroud)

所以这让我想知道是否有一些我不理解的东西.在创建和销毁元素w/this指令的情况下,它们不会导致内存泄漏吗?

我错过了什么?

jquery jquery-ui angularjs angular-ui angularjs-directive

7
推荐指数
1
解决办法
3042
查看次数

存储的更改侦听器未在componentWillUnmount上删除?

我在reactjs-flux编写一个简单的应用程序,一切正常,除了我收到来自reactjs的警告,告诉我我在未安装的组件上调用setState.

我已经弄明白这是因为没有从商店中删除组件被挂钩的changelisteners componentWillUnmount.我知道这一点,因为当我打开监听器列表时,Eventemitter我会看到应该被销毁的监听器,并且当我多次挂载/卸载相同的组件时,列表会变大.

我从我的BaseStore粘贴代码:

import Constants from '../core/Constants';
import {EventEmitter} from 'events';

class BaseStore extends EventEmitter {
  // Allow Controller-View to register itself with store
  addChangeListener(callback) {
    this.on(Constants.CHANGE_EVENT, callback);
  }

  removeChangeListener(callback) {
    this.removeListener(Constants.CHANGE_EVENT, callback);
  }

  // triggers change listener above, firing controller-view callback
  emitChange() {
    this.emit(Constants.CHANGE_EVENT);
  }
}

export default BaseStore;
Run Code Online (Sandbox Code Playgroud)

我从遇到此错误的组件中粘贴相关代码(但它适用于所有组件):

@AuthenticatedComponent
class ProductsPage extends React.Component {
  static propTypes = {
    accessToken: PropTypes.string
  };

  constructor() {
    super();
    this._productBatch;
    this._productBatchesNum;
    this._activeProductBatch;
    this._productBlacklist;
    this._searchById;
    this._searchingById;
    this.state = this._getStateFromStore(); …
Run Code Online (Sandbox Code Playgroud)

flux reactjs reactjs-flux

7
推荐指数
1
解决办法
3867
查看次数