小编mod*_*tor的帖子

我最近在学习React Native,并且在使用Socket.IO时遇到了麻烦.我正在使用最新的React native和cli(刚更新),这是我的代码:

import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View
} from 'react-native';

window.navigator.userAgent = 'react-native';

const io = require('socket.io-client/socket.io');
const socket = io('localhost:3000', { jsonp: false });
socket.connect();

class wschat extends Component { ... }

你可以看到,代码非常简单,没有错误.这是我的服务器代码:

"use strict";
const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http);

http.listen(3000, () => {
    console.log('WSChat Server for React-Native listening on port 3000');
});

io.on('connection', (socket) => {
    console.log('connected: ' …

我对使用 Apache Cordova 有一些疑问。正如你看到标题，是否可以从Cordova获取环境变量？我在google上搜索了将近半天，但还是找不到。我还查找了 Cordova 插件注册表，但都没有找到。

我想要做的是将某种环境变量设置为“生产”或“开发”，例如 Node.js 中的 NODE_ENV。如果有人帮助我，我将不胜感激;)

我有使用Socket.io的问题.

代码很简单:

var socket = null;
var socketInit = false;    //if it is true, use reconnect

...
function connect() {
    if(!socketInit) {
        socket = io();
        socketInit = true;

        //attach event handlers
        socket.on('connect', function() {
            console.log('connect fired!');
        });
        socket.on('disconnect', function() {
            console.log('disconnect fired!');
        });
        socket.on('reconnect', function() {
            console.log('reconnect fired!');
        });
    }
    else {
        socket.io.connect();
    }
}

...
function disconnect() {
    socket.disconnect();
}

如您所见,有两个连接或断开套接字的功能.在connect函数中,它将'connect','disconnect','reconnect'处理程序连接到套接字.

首先我称之为连接功能,效果很好.服务器端也运行良好.我称之为断开连接功能,也适用于服务器.

但我再次调用connect函数,这意味着"socketInit"变量为true,所以connect函数尝试:

socket.io.connect();

我检查了服务器和客户端控制台,看起来它已连接,但问题是事件没有被触发!

服务器端'connection'事件在重新连接时被触发,但客户端'connect'或'reconnect'事件未被触发.我试图找出发生了什么,但我仍然没有得到它.我多次检查Web控制台和服务器控制台,并且连接本身工作正常,但问题是事件无法正常工作!

如果有人知道,我将非常感谢帮助我.谢谢 ;)

ps我试图添加'reconnected','reconnection','reconnect_error'事件处理程序,但两者都不起作用.

我正在用React + React-Router创建网站.我使用react-router-transition为切换视图设置动画,并使用React-motion-ui-pack为小组件设置动画.

问题是,当我在台式机上测试时,动画很好,但在移动浏览器上进行了测试,它会造成很大的滞后.

据我所知,反应路由器转换和react-motion-ui-pack都使用React-Motion.当我使用CSS3 Transforms添加动画时,它不起作用,所以我直接使用CSS属性(比如使用top/left而不是translate transforms).

这是我的代码的一部分:

export default class App extends React.Component {
    render() {
        return (
            <div id="App">
                <TopBar />
                <GlobalNav />

                <RouteTransition
                    pathname={this.props.location.pathname}
                    atEnter={{ opacity: 0.0 }}
                    atLeave={{ opacity: 1.0 }}
                    atActive={{ opacity: 1.0 }}>
                    <div id="views">
                        {this.props.children}
                    </div>
                </RouteTransition>

                <Footer />
            </div>
        );
    }
}

如您所见,我修改了onEnter和onLeave的不透明度.但这会导致移动设备的性能低下.

有没有办法解决这个问题？

我正在为我的网站使用Express并使用凭证xhr。我想请求http://example.com来自http://admin.example.com或者http://service1.example.com，这是我Access-Control-Allow-Origin在Express服务器部分：

// CORS
app.use((req, res, next) => {
    res.setHeader('Access-Control-Allow-Origin', 'http://*.example.com');
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,Content-Type');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE');
    next();
});

但是，当我尝试从http://admin.example.com到http://example.com的凭据xhr时，它失败并显示：

提取API无法加载http://example.com/api/v1/authentication/signin。对预检请求的响应未通过访问控制检查：“ Access-Control-Allow-Origin”标头的值“ http://*.example.com”不等于提供的来源。因此，不允许访问源“ http://admin.example.com ”。让服务器发送带有有效值的标头，或者，如果不透明的响应满足您的需要，请将请求的模式设置为“ no-cors”，以在禁用CORS的情况下获取资源。

看起来这是由于来自浏览器的原因导致无法理解确切的*.example.com含义，并拒绝了该请求。

我想从这些域中请求：

• example.com
• admin.example.com
• service1.example.com
• service2.example.com
• [anything] .example.com

我使用XHR的Fetch API，并设置了credentials: true。有什么我想念的吗？任何建议将不胜感激。

我在我的 centOS 服务器上使用 node v0.10.x，我想更新 node.js，所以关注了一些文章。首先删除当前安装的：

# which node
# cd /usr
# rm -r bin/node bin/node-waf include/node lib/node lib/pkgconfig/nodejs.pc share/man/man1/node.1

然后检查 node -v 不工作，很好。但是使用 yum 不会安装最新的 Node.js，所以我搜索了一些帖子并找到了这个：https : //www.metachris.com/2015/10/how-to-install-nodejs-5-on-centos-and -ubuntu/

所以我遵循了命令：

# rpm -Uvh https://rpm.nodesource.com/pub_5.x/el/7/x86_64/nodesource-release-el7-1.noarch.rpm
# yum install nodejs -y

这就是问题所在。它打印了许多错误并不断失败。

Resolving Dependencies
--> Running transaction check
---> Package nodejs.x86_64 0:0.10.42-4.el6 will be updated
--> Processing Dependency: nodejs(x86-64) = 0.10.42-4.el6 for package:     nodejs-devel-0.10.42-4.el6.x86_64
---> Package nodejs.x86_64 0:5.11.1-1nodesource.el7.centos will be an update
--> Running transaction check
---> Package nodejs-devel.x86_64 …

我希望在通过某些条件解决后停止承诺链.下面的代码可能有助于理解我在说什么.

function update(id, data) {
    return new Promise((resolve, reject) => {
        let conn;

        pool.get()
        .then((db) => {
            conn = db;

            if(Object.keys(data).length === 0) {
                return resolve({ updated: 0 });
            }
            else {
                return generateHash(data.password);
            }
        })
        .then((hash) => {
            conn.query("UPDATE ... ", (err, queryResult) => {
                if(err) {
                    throw err;
                }

                resolve({ updated: queryResult.affectedRows });
            });
        })
        .catch((err) => { ... })
    });
}

请注意,pool.get()是promise包装的API,用于从我创建的MySQL模块获取连接池.

我正在尝试做的是更新用户数据.并且为了节省服务器资源,如果没有要更新的数据,我避免更新(Object.keys(data).length === 0).

当我尝试这个代码时,即使没有数据要更新,第二个(更新数据库)总是会发生!

我读过这篇文章,但没有奏效.当我调用"return resolve();"时为什么没有停止承诺链？我该如何正确地阻止它？我真的很喜欢使用Promises,但有时候,这种事情会让我发疯.非常感谢帮助我解决这个问题.谢谢!

PS无论如何,我正在使用节点v6.2.2.

我使用 sequelize-cli 创建了一个表格，但是我忘记添加一列：标题。

所以我生成了新的迁移：

$ sequelize migration:create --name update-notes

并将这些代码放在迁移文件中：

'use strict';

module.exports = {
  up: (queryInterface, Sequelize) => {

    return queryInterface.addColumn(
      'Notes',
      'title',
      Sequelize.STRING
    );
  },

  down: (queryInterface, Sequelize) => {
   return queryInterface.removeColumn(
     'Notes',
     'title'
   );
  }
};

运行迁移并从数据库检查表架构后，它可以工作：

$ sequelize db:migrate

但是模型还没有我新添加的列：

'use strict';
// models/notes.js
module.exports = (sequelize, DataTypes) => {
  const Notes = sequelize.define('Notes', {
    content: DataTypes.TEXT    // NO 'TITLE' COLUMN
  }, {});
  Notes.associate = function(models) {
    // associations can be defined here
  };
  return Notes; …

我正在使用 gulp + browserify 来使用 ES2015 并响应 jsx。我想添加一些像这样的外部反应组件：DataPicker。

这是第一次在我的项目中添加外部反应组件，所以我不知道 css 也需要导入。

但我没有使用 webpack，我只是使用 gulp。这些是我的 gulp 节点模块：

• 乙烯基源流
• 乙烯基缓冲液
• 浏览器化
• 巴别化
• babel-preset-es2015
• babel-preset-react

这是我的 gulpfile：

gulp.task('build', function() {
    return browserify('./app.js')
    .transform(babelify, { presets: ["es2015", "react"] }
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(gulp.dest('./dist'));
});

我发现在 javascript 中使用 import/require css 需要“browserify-css”，所以我添加了“npm install browserify-css”。然后我将转换方法添加到我的 gulpfile 中，如下所示：

gulp.task('build', function() {
    return browserify('./app.js')
    .transform(babelify, { presets: ["es2015", "react"] }
    .transform(require('browserify-css'))
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(gulp.dest('./dist'));
});

但它刚刚抛出了这样的错误：

events.js:154, 抛出 er; // 未处理的 'error' 事件，SyntaxError: Unexpected token

我在我的 …

我有一个关于使用react的问题.从标题中可以看出,我想知道是否可以在"dangerouslySetInnerHTML"属性中使用React组件(由React.createClass创建).我试过了,但React打印的代码没有像这样的转换:

const MySubComponent = React.createClass({
    render() {
        return (<p>MySubComponent</p>);
    }
});

...

let myStringHTML;
myStringHTML += "<ul>";
myStringHTML += "    <li>";
myStringHTML += "        <MySubComponent />";
myStringHTML += "    </li>";
myStringHTML += "</ul>";

const MyComponent = React.createClass({
    render() {
        return (
            <div dangerouslySetInnerHTML={{__html:myStringHTML}}></div>
        );
    }
});

我期望

<ul>
    <li>
        <p>MySubComponent</p>
    </li>
</ul>

但代码与原始字符串相同,这意味着React不会转换MySubComponent.

有没有办法解决这个问题？上面的例子很简单,但我的实际代码非常复杂.非常感谢gimme一只手;)