小编Jon*_*les的帖子

如果用户登录使用 React 路由器重定向到仪表板？

我正在尝试实施重定向解决方案。如果用户已经登录并尝试访问主页（对每个人都可见），我想重定向到仪表板（仅对登录用户可见）。

我当前的解决方案：

export const PublicRoute = ({ auth, ...props }) => {
    const isAllowed = auth.isLoggedIn();
    return isAllowed
        ? <Redirect to="/dashboard" />
        : <Route {...props} />;
};

Run Code Online (Sandbox Code Playgroud)

用法：

<PublicRoute
    auth={{ isLoggedIn: () => AuthService.isLoggedIn() }}
    path="/"
    component={Main}
/>

Run Code Online (Sandbox Code Playgroud)

私有路由组件：

export const ProtectedRoute =  ({ auth, ...props }) => {
    const isAllowed = auth.isLoggedIn();
    return isAllowed
        ? <Route {...props} />
        : <Redirect to="/login" />;
};

Run Code Online (Sandbox Code Playgroud)

但是，当执行此操作时，我收到以下警告：

警告：您尝试重定向到当前所在的同一路线：“/dashboard”

路线：

<Provider store={store}>
    <Router history={History}>
        <Switch>
            <PublicRoute
                auth={{ isLoggedIn: () => AuthService.isLoggedIn() }}
                exact={true} …

Run Code Online (Sandbox Code Playgroud)

javascript typescript reactjs react-router react-redux

har*_*rry

2018 03-17

5
推荐指数

1
解决办法

9789
查看次数

Blanket.js无法使用qunit

我无法使用blanket.js测试覆盖率来使用qunit,尽管很多尝试重新配置并尝试调用调试,但实际上没有任何反应.

这些是我试图遵循的文档说明 - https://github.com/alex-seville/blanket/blob/master/docs/getting_started_browser.md#getting-started-guide-browser-version

这是我的试运行员

<!doctype html>
<html>
    <head>
    <meta charset='UTF-8' />
    <meta http-equiv='content-type' content='text/html; charset=utf-8' />

    <title>bootstrap-treeview.js Tests</title>

    <link rel='stylesheet' href='./lib/qunit-1.12.0.css'>

    <script src='./lib/jquery.js'></script>
    <script src='./lib/qunit-1.12.0.js'></script>
    <script data-cover-flags="debug" src="./lib/blanket.min.js"></script>
    <script data-cover src='./lib/bootstrap-treeview.min.js'></script>
    <script src='./tests.js'></script>
</head>
<body>
    <div id="qunit"></div> 
    <div id='qunit-fixture'>
        <div id="treeview"></div>
    </div>
</body>

Run Code Online (Sandbox Code Playgroud)

我必须遗漏一些基本的东西,没有控制台错误,没有任何东西.我的报告运行正常,qunit报告像往常一样显示,但没有添加毯子.尽管添加了data-cover-flags ="debug",但没有生成额外的覆盖率报告,也没有调试.

任何帮助,方向,非常感谢？

javascript unit-testing qunit blanket.js

Jon*_*les

2014 01-02

4
推荐指数

1
解决办法

2523
查看次数

如何在Javascript中从二维数组创建一个对象数组？

这类似于我的实际问题,但我觉得说明我需要解决的问题,而不会使事情复杂化.

我需要通过迭代2d数组来创建一个对象数组.2d数组看起来像下面的"sampleArray".

let sampleArray = [ 
  ["open",2], 
  ["high",3], 
  ["low",5], 
  ["close", 10], 
  ["volume", 20], 
  ["open",20], 
  ["high",30], 
  ["low",50], 
  ["close", 100], 
  ["volume", 21],
  ["open",21], 
  ["high",33], 
  ["low",51], 
  ["close", 1], 
  ["volume", 2],
  ["open",7], 
  ["high",8], 
  ["low",5], 
  ["close", 11], 
  ["volume", 22]
 ];

Run Code Online (Sandbox Code Playgroud)

我目前正在格式化一组特别丑陋的API数据,并将数据展平为二维数组.我现在需要的是将这些值放入一个包含5个对象的数组中,其中每个对象的数据属性由具有该特定标签的所有值填充.

newObject = [
    {
     data: [2,20,21, ...]
     label: "open"  
    }, 
    {
     data: [3,50, ...]
     label: "high"
    }, 
    {
     data: [etc...]
     label: "low"  
    }, 
    {
     data: [etc...]
     label: "close"  
     }, 
    {
     data: [etc...]
     label: "volume"  
     }
]

Run Code Online (Sandbox Code Playgroud)

我大约需要3个小时才能完成这项工作,并且觉得我这一切都错了,我不断得到一个错误,即newArray [i] ["label"]未定义,我明白为什么会发生这种情况(没有对象)该属性存在YET,我只是不确定如何表达这个想法(如果具有该标签的对象尚不存在,创建它并将该匹配值添加到它的value属性)在javascript中.

function makeArray(array) {
  let newArray …

Run Code Online (Sandbox Code Playgroud)

javascript arrays object populate

Dav*_*ias

2018 03-17

4
推荐指数

1
解决办法

123
查看次数

React-native错误:Metro Bundler无法在8081上收听？

我正在使用react-native最新版本并收到以下错误:

我该如何解决这个错误？谢谢!

react-native

mmy*_*mmy

2018 03-15

2
推荐指数

1
解决办法

2570
查看次数

Flowtype:基于类型提示类的HOC组件

我正在尝试键入一个HOC,它为传递的Component添加一个prop,如下所示:

// @flow
import React, { Component } from 'react';
import type { ComponentType } from 'react';

type Props = {
  x: string,
}

const withReferral = <PassedProps: {}>(
    WrappedComponent: ComponentType<PassedProps>
): ComponentType<$Diff<PassedProps, Props>> => {
  class withReferral extends Component<PassedProps> {
    render() {
      return (<WrappedComponent {...this.props} x={'test'} />);
    }
  }

  return withReferral;
};

export default withReferral;

Run Code Online (Sandbox Code Playgroud)

我得到的错误是:"无法返回withReferral,因为withReferral [1]的静态中缺少可调用签名,但存在于React.StatelessFunctionalComponent [2]中."

用[1]引用return withReferral和[2]引用React定义:React$StatelessFunctionalComponent<Props>

谁有任何帮助？

javascript reactjs flowtype

Sve*_*ert

2018 03-17

2
推荐指数

1
解决办法

625
查看次数

使用React.Node时流类型错误

我已经编写了一个我喜欢的实用程序函数，但是由于某种原因，我无法实现它的流类型。下面的代码产生错误。

// @flow
import React from 'react';
import type { Node } from 'react';

export const partializeComponent = (partialProps: any) =>
  (Component: Node) =>
    (props: any): Node => (
      <Component
        {...partialProps}
        {...props}
      />
    );

Run Code Online (Sandbox Code Playgroud)

由于错误非常冗长，我改用了屏幕截图

reactjs flowtype

ala*_*udi

2018 02-18

1
推荐指数

1
解决办法

1757
查看次数

如何使用 React Native 内联渲染图像和文本？

如何在文本所在的同一行获取共享图标？

import React, {Component} from 'react';
import {
    ActivityIndicator,
    AsyncStorage,
    Dimensions,
    Image,
    ScrollView,
    Share,
    StatusBar,
    StyleSheet,
    TouchableOpacity,
    View
} from 'react-native';

import {Text} from 'react-native-elements';
import {Button} from 'react-native-share';
import Hyperlink from 'react-native-hyperlink'
import Icon from 'react-native-vector-icons/dist/FontAwesome';

const SCREEN_WIDTH = Dimensions.get('window').width;
const SCREEN_HEIGHT = Dimensions.get('window').height;

const IMAGE_SIZE = SCREEN_WIDTH - 80;

class CustomButton extends Component {
    constructor() {
        super();
        this.state = {
            selected: false
        };
    }

    componentDidMount() {
        const {selected} = this.props;
        this.setState({
            selected
        });
    }

    render() {
        const {title} …

Run Code Online (Sandbox Code Playgroud)

javascript react-native

Nik*_*ntz

2018 03-24

0
推荐指数

1
解决办法

5408
查看次数