小编ras*_*tay的帖子

如何在 axios 中捕获状态 = 取消?

我目前正在运行 2 台服务器:

  1. 使用 react 为视图提供服务,该 react 从使用 express 构建的 REST API 检索数据。
  2. 为视图提供 REST API。

以下是我登录用户的操作:

// Redux Action
export function loginUser(creds, role) {

  return dispatch => {
    // We dispatch requestLogin to kickoff the call to the API
    dispatch(requestLogin(creds));

    return axios.post(`${ROOT_URL}/login/${role}`, creds).then((response) => {
        console.log(response);

        if(response.status === 200) {
          // If login was successful, set the token in local storage
          localStorage.setItem('id_token', response.data);

          // Dispatch the success action
          dispatch(receiveLogin(response));

          return response;
        }
      }).catch(err => {
        // If there was …
Run Code Online (Sandbox Code Playgroud)

ajax rest express redux axios

6
推荐指数
1
解决办法
6857
查看次数

ESLINT:解析错误:package.json中的意外标记

{
  "name": "react-redux-starter-kit",
  "version": "1.0.0",
  "description": "This would be the starter kit for react projects.",
  "main": "index.html",
  "scripts": {
    "start": "rm -rf build/ && rm -rf dist/ && webpack && webpack-dev-server --progress --colors",
    "build": "rm -rf build/ && rm -rf dist/ && NODE_ENV=production webpack --config ./webpack.production.config.babel.js --progress"
  },
  "repository": {
    "type": "git",
    "url": "git+https://rahulshettyprdxn@bitbucket.org/rahulshettyprdxn/react-devops.git"
  },
  "keywords": [
    "react",
    "webpack",
    "react-native"
  ],
  "author": "Rahul Shetty",
  "license": "MIT",
  "homepage": "https://bitbucket.org/rahulshettyprdxn/react-devops#readme",
  "devDependencies": {
    "babel-core": "^6.5.2",
    "babel-eslint": "^5.0.0",
    "babel-loader": "^6.2.3",
    "babel-plugin-react-transform": "^2.0.0",
    "babel-preset-es2015-without-strict": "0.0.2", …
Run Code Online (Sandbox Code Playgroud)

json eslint atom-editor

5
推荐指数
1
解决办法
4779
查看次数

为什么React Native的.flowconfig会忽略.android.js文件?

我想在我的React Native项目中测试流程.我跑了流,发现它对Android文件没有影响.我在.flowconfig中找到了下面给出的代码:

[ignore]

# We fork some components by platform.
.*/*.web.js
.*/*.android.js
Run Code Online (Sandbox Code Playgroud)

为什么React Native团队会忽略这些文件?我无法找到关于其他地方的更多信息.我知道我可以编辑和流程也会开始考虑Android文件,但我不确定它是否正确.例如,这就是fabergua对一个问题发表评论的问题Flow没有识别与之相关的特定于平台的react-native文件:

@mhollweck:React Native的默认.flowconfig设置为忽略所有.android.js文件.您可以通过更改 - 来解决此问题./ [.] android.js到./ node_modules /.项目的.flowconfig中的/*[.] android.js.

但是,我们应该继续这样的解决方案吗?当我们通过react-native-git-upgrade升级它时,它不会搞乱项目吗?

javascript android react-native

5
推荐指数
1
解决办法
1146
查看次数

如何使用React应用特定于页面的全屏背景图像?

我有一个名为admin-login.jsx的组件,下面是相同的代码:

// AdminLogin Component
class AdminLogin extends Component {

  componentDidMount() {
    let elem = document.querySelector('body');
    addClass(elem, 'admin-login-page');
  }

  componentWillUnmount() {
    let elem = document.querySelector('body');
    removeClass(elem, 'admin-login-page');
  }

  render() {

    return(
      <div className="admin-login">
        <LoginModule
          submit={handleSubmit(this.onLogin.bind(this))}
          email={email} password={password}
          loginFailed={this.state.loginFailed}
          disableSubmit={this.state.isLoading}
        />
      </div>
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

admin.login.scss

@import "styles/site-mixins";

.admin-login-page {
  background: url(../images/admin.login.bg.jpg) no-repeat top center fixed;
  @include prefix(background-size, cover, webkit moz ms);
}
Run Code Online (Sandbox Code Playgroud)

routes.js

import App from 'components/app';
import Admin from './admin/admin';

const rootRoute = {
  'path': '/',
  'component': App, …
Run Code Online (Sandbox Code Playgroud)

javascript css reactjs

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

是否有键盘快捷键来切换/显示React Native中的Inspector?

在React Native中构建应用程序的UI时,我倾向于使用Toggle/Show检查器.要切换/显示检查器,我点击CMD + DiOS和CMD + MAndroid打开菜单,然后点击切换或显示检查器.

是否有用于在不打开菜单的情况下切换Inspector的键盘快捷键?例如,CMD + R重新加载应用程序.我没有必要访问菜单.

如果检查员没有快捷方式,我该如何指定快捷方式CMD + R?谢谢你的期待.

javascript android ios reactjs react-native

4
推荐指数
2
解决办法
2635
查看次数

iOS(React native):使用React导航从标题的顶部到不必要的空间

路由配置

/**
 * Author: Rahul
 * Date: 25 Feb 2018
 *
 * Routes
 * @flow
 */
import React from 'react';
import { View, Text } from 'react-native';
import { StackNavigator } from 'react-navigation';
import LoginScreen from 'src/containers/login';
import HomeScreen from 'src/containers/home';
import FeedsScreen from 'src/containers/feeds';
import { AppLogo } from 'src/components';
import { background } from 'src/styles/';
import { SIGNED_IN, SIGNED_OUT, HOME, LOGIN, FEEDS } from './constants';

const navigationOptions = {
  navigationOptions: {
    headerLeft: (
      <View>
        <Text>Hamburger</Text>
      </View>
    ),
    headerRight: …
Run Code Online (Sandbox Code Playgroud)

javascript ios reactjs react-native react-navigation

4
推荐指数
2
解决办法
2527
查看次数

使用react-native-gesture-handler中的PanGestureHandler时位置重置为0

import React, { useRef, useState, useCallback } from 'react';
import { View, Animated } from 'react-native';
import { PanGestureHandler } from 'react-native-gesture-handler';


const InfoBox = ({ info }: Props) => {
  const [currenPos, setCurrentPos] = useState<number>(0);
  const translateY = useRef(new Animated.Value(0)).current;

  const onGestureEvent = useCallback(
    Animated.event(
      [
        {
          nativeEvent: {
            translationY: translateY,
          },
        },
      ],
      {
        useNativeDriver: true,
      },
    ),
    [],
  );

  const handleTransformStyle = {
    transform: [
      {
        translateY,
      },
      {
        translateX: -55,
      },
    ],
  };

  return (
    <View …
Run Code Online (Sandbox Code Playgroud)

javascript animation reactjs react-native react-native-gesture-handler

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

graphql-type-json 导出的 GraphQLJSON 和 GraphQLJSONObject 有什么区别?

来自官方包文档:

GraphQLJSON 可以表示任何 JSON 可序列化的值,包括标量、数组和对象。GraphQLJSONObject 专门表示 JSON 对象,它涵盖了 JSON 标量的许多实际用例。

这听起来有点令人困惑,因为对我来说,这两个定义似乎非常相似。有人可以通过一个例子帮助我更好地理解这一点吗?谢谢期待。

https://www.npmjs.com/package/graphql-type-json

json graphql graphql-js express-graphql graphql-tools

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

FIREBASE警告:用户回调引发了异常.错误:发送后无法设置标头

我们正在开发一个应用程序,我们将Firebase用作数据库,并表示作为中间件/后端,用于路由我们在Reactjs中开发的前端使用的RESTful API.

以下是我们的server.js文件:

var express = require('express');
var app = express();

//Used for getting POST variables from forms as well as query parameters
var bodyParser = require('body-parser');
var validator = require('express-validator');

//Contains all the routes
var routes = require('./routes/routes');
var path = require('path');

//Used for serving jade files
app.set('view engine', 'jade');
//For serving static resources like scripts, styleSheets, html
app.use(express.static(__dirname + '/views'));

app.all('/*', function(req, res, next) {
 res.header("Access-Control-Allow-Origin", "*");
 res.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type, Accept");
 res.header("Access-Control-Allow-Methods", "POST, GET");
 next();
});

// configure …
Run Code Online (Sandbox Code Playgroud)

rest node.js express firebase

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

寄生虫组合继承:父原型的克隆如何包含尚未分配的子原型的属性?

请查看Nicholas C. Zakas的书籍Professional JS for Web Developers的代码片段:

function object(o){
  function F(){}
  F.prototype = o;
  return new F();
}

function inheritPrototype(subType, superType){
  var prototype = object(superType.prototype);
  console.log(prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}

function SuperType(name){
  this.name = name;
  this.colors = [“red”, “blue”, “green”];
}

SuperType.prototype.sayName = function(){
  alert(this.name);
};

function SubType(name, age){
  SuperType.call(this, name);
  this.age = age;
}

inheritPrototype(SubType, SuperType);


SubType.prototype.sayAge = function(){
  alert(this.age);
};
Run Code Online (Sandbox Code Playgroud)

在函数inheritPrototype()中,我记录了变量原型.我看到sayAge()是变量原型的属性.我不确定sayAge属性在将其分配给对象(supertype.prototype)时如何分配给原型.此外,在调用函数inheritPrototype之后,SubType.prototype.sayAge正在初始化.所以我很困惑看到原型有sayAge作为它的属性.

https://jsfiddle.net/shettyrahul8june/ed22rrnj/

在JSFiddle中运行后检查开发人员控制台.谢谢.

javascript oop javascript-objects

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

UNIQUE约束不在postgresql中的列上工作

下面是架构:

BEGIN;

DROP TABLE IF EXISTS contacts;

CREATE TABLE contacts (
  user_id SERIAL,
  first_name VARCHAR NOT NULL,
  last_name VARCHAR NOT NULL,
  email VARCHAR NOT NULL,
  phone_number VARCHAR NOT NULL,
  status VARCHAR NOT NULL,
  created_at TIMESTAMP DEFAULT current_timestamp,
  UNIQUE (phone_number, email)
);

COMMIT;
Run Code Online (Sandbox Code Playgroud)

以下是使用express和pg-promise在数据库中插入数据的代码:

function createContact(req, res, next) {
  db.none('insert into contacts(first_name, last_name, email, phone_number, status)' +
      'values(${first_name}, ${last_name}, ${email}, ${phone_number}, ${status})',
    req.body)
    .then(() => {
      res.status(200)
        .json({
          status: 'success',
          message: 'Inserted one contact',
        });
    })
    .catch(err => next(err));
}
Run Code Online (Sandbox Code Playgroud)

UNIQUE约束似乎不适用于 …

postgresql

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

如何从 Android Studio 中删除意外添加的重复 Gradle 版本?

我想使用 OpenJDK 11,因此,我通过转到“设置”->“Gradle”->“Gradle JDK”在 Android Studio 中提供了路径。后来,当我试图测试添加相同 JDK 的结果时,我看到它被添加,并且(2)列表中带有相同的名称后缀。我分享图像是为了提供更清晰的信息。

现在,如何删除列出的重复条目?谢谢。

在此输入图像描述

android android-studio react-native

0
推荐指数
1
解决办法
854
查看次数