小编Jac*_* M.的帖子

我真的很困惑试图用玩笑的文档的帮助下创建测试https://facebook.github.io/jest/docs/timer-mocks.html#content

我正在尝试检查容器安装时的状态,然后几秒后,我在状态下手动设置值(使用setTimeout()).

我在Main的componentDidMount中有一个函数,如下所示:

componentDidMount() {
    this.setStateAfterDelay();
}

该功能的作用是:

setStateAfterDelay = () => {
    setTimeout(() => {
        this.setState({ fruits: ['banana', 'apple', 'orange', 'vodka', 'kiwi'] });
    }, 1500);
}

我完成了第一部分:

const component = mount(<Main />);
expect(component.state().fruits).toEqual(null);

但我不知道如何再次检查状态,让我说2000ms？

任何帮助表示赞赏:)

我有一个基本功能：

组件/第一个组件：

sayMyName = (fruit) => {
    alert("Hello, I'm " + fruit);
    return fruit;
}

当我尝试在FirstComponent.test.js 中使用 Jest对其进行测试时：

import FirstComponent from '../components/FirstComponent';

describe('<FirstComponent />', () => {
    it('tests the only function', () => {
        FirstComponent.sayMyName = jest.fn();
        const value = FirstComponent.sayMyName('orange');
        expect(value).toBe('orange');
    });
});

测试说：比较两种不同类型的值。预期的字符串，但收到未定义。

显然我没有导入函数来测试正确的方式？

我不够聪明，无法理解 Jest 文档如何从组件测试功能。

是否有一些简单的方法可以从组件中导入函数并对其进行测试？

编辑： 这现在使用“反应测试渲染器”

import FirstComponent from '../components/FirstComponent';
import renderer from 'react-test-renderer';

describe('<FirstComponent /> functions', () => {
        it('test the only function', () => {
            const …

我试图找出如何使用apollo-link-http与apollo-upload-client.

两者都创建一个终止链接,但我怎么能一起使用这两个？在我的index.js中我喜欢这个,但它不会工作因为两个链接都终止=>

const uploadLink = createUploadLink({ uri: process.env.REACT_APP_GRAPHQL_URL });

const httpLink = new HttpLink({ uri: process.env.REACT_APP_GRAPHQL_URL });

const client = new ApolloClient({
    link: ApolloLink.from([ authLink, logoutLink, stateLink, uploadLink, httpLink ]),
    cache,
});

有帮助吗？我对Apollo/Graphql没什么经验,但我想使用文件上传组件.

我真的很反应.我正在尝试让父母根据状态更改显示的页面.我的子组件中有一个按钮,它应该向父组件发送"true"或"false",以便它知道是否要呈现它.我认为应该用这样的道具来完成:

this.state = {
   btnNewScreen: this.props.btnNewScreen //true or false
};

但我不能让它工作.你能给出任何提示吗？这是完整的父母 - 孩子

parent - maindisplay.js

import React from 'react';
import Mainpage_Addscreen from '../components/subcomponents/mainpage-addscreen';
import Mainpage_Showscreens from '../components/subcomponents/mainpage-showscreens';
//
class MainDisplay extends React.Component {
    constructor() {
        super();
        this.state = {
            btnNewScreen: false //should be this.props.btnNewScreen?
        };
    }

    render() {
        var renderThis;
        if (!this.state.btnNewScreen) {
            renderThis =
                <div>
                    <Mainpage_Addscreen />
                    <Mainpage_Showscreens />
                </div>
        }
        else {
            //renderThis = <AddScreen />
            renderThis =
                <div>
                    <Mainpage_Addscreen />
                    <h3>Change to this when true (button …

我正在使用React并试图创建一个登录表单.当用户输入正确的登录信息时,rest api将返回JWT令牌.但是,我无法找到如何将状态"令牌"设置为响应的值.我仍然可以将response.token保存到localstorage并且显示正确.我认为"这个"指的是错误的功能,但是如何在不破坏逻辑的情况下解决这个问题呢？任何提示？谢谢

Login.js

import React from 'react';

import axios from 'axios';

import Glyphicon from 'react-bootstrap/lib/Glyphicon';

import MyInput from './../components/Input';

import { connect } from "react-redux";

import { Form } from 'formsy-react';

var server = "http://localhost:3000";

class Login extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            canSubmit: false,
            token: null
        };
        this.enableButton = this.enableButton.bind(this);
        this.disableButton = this.disableButton.bind(this);
        this.submit = this.submit.bind(this);
    }

    submit(data) {
        axios.post(server + '/login', {
            username: data.username,
            password: data.password
        })
            .then(function (response) {
                if (response.data.token) {
                    var token …

我有一个工作图像上传前端/后端代码工作。现在我希望能够在上传后从服务器获取图像。

问题是图像必须在经过身份验证的路由后面，用户必须在标题或正文中传递 jwt 令牌。

当我尝试像这样获取图像时：

fetch(imageURL, {
    method: 'GET',
    headers: {
        'x-access-token': localStorage.getItem('token')
}

我只是得到一个 Form 对象作为响应：

<img alt="Your pic" src="[object FormData]">

除了将 url 粘贴到 'src' 属性中之外，还有什么方法可以将图像放入 HTML 'img' 标签中，因为它会导致 401 (Unauthorized)

我有这个带有multer文件上传的快速路由.上传完成后,我想将图像编码为base64并发送响应.

但是当我这样做时,代码会尝试在将文件创建到文件夹之前执行base64编码.

编辑:添加了存储和上传功能

const storage = multer.diskStorage({
    destination: (req, file, callback) => {
        if (!fs.existsSync('./uploads')) {
            fs.mkdirSync('./uploads');
        }
        let path = './uploads';
        callback(null, path);
    },
    filename(req, file, cb) {
        let fileExt = file.originalname.substring(file.originalname.lastIndexOf('.')).toLowerCase();
        if (!imageFilter(fileExt)) {
            return false;
        } else {
            cb(null, file.originalname);
        }
    },
    onError: function (err, next) {
        console.log('error', err);
        next(err);
    },
});

const upload = multer({
    storage,
    limits: {
        fileSize: 1000 * 1000 * 2 // 2 MB
    }
}).single('file');

router.post('/upload', function (req, res) {
    var …

我想知道为什么会这样？

我有一个存储在var myObj中的json对象:

var myObj = JSON.parse(fs.readFileSync('json/data.json', 'utf8'));

然后我通过以下方式从原始对象中获取克隆:

var modObj = myObj;

之后我从clone中删除空值:

cleansedObj = removeEmpty(modObj);

为什么这也会改变原始的myObj并从中删除空值？

这是功能:

function removeEmpty(obj) {
  Object.keys(obj).forEach(function(key) {
    if (obj[key] && typeof obj[key] === 'object') removeEmpty(obj[key])
    else if (obj[key] === "") delete obj[key]
  });
  return obj;
};

我通过这样做找到了一种解决方法,但似乎是不成功的操作:

var cleansedObj = JSON.stringify(myObj);
cleansedObj = removeEmpty(JSON.parse(cleansedObj));

谢谢!

我尝试使用 axios 发布一个对象。我需要它是这样的格式：

var dataObj = {username:"username",password:"password",data1:"data1"};

当我用 axios 发布它并在后端捕获时，它会向对象添加一个额外的键，如下所示：

{dataObj:{username:"username",password:"password",data1:"data1"}};

我怎样才能在将它发送到后端之前摆脱这个额外的字段，让它看起来像这样？

{username:"username",password:"password",data1:"data1"}

我知道我可以在后端解析它，但我不能修改后端因为它不是我的。

这是我的 axios 帖子的样子：

axios.post('http://192.168.1.1xx:3000/data', {
    dataObj
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});

谢谢 ：）

I was wondering what would be the best way to move a circle from point A to point B using smooth animation.

I get new coordinates with websocket every second and would like to animate the circle move from last point to the new point during that second.

我已经在这个小提琴中看到了设置的外观。为了这个测试，我用手动按钮输入代替了ws侧，但是缺少了移动圆环的功能。

jQuery也很受欢迎。

var x = 100;
var y = 50;
var r = 10;

var WIDTH = 600;
var HEIGHT = 400;

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");

function circle(x, …