小编bub*_*ord的帖子

使用 React refs 关注同级元素

我正在尝试创建一个使用 refs 的反应表单。我需要的是当用户在一个输入字段中输入一个值时。它应该自动关注下一个同级元素,即第二个输入元素,依此类推,直到到达输入字段的末尾,并且表单的值应该自动保存到状态中。

我对使用反应参考还很陌生。我尝试开发一个基本的工作但陷入错误:

TypeError: Cannot read property 'nextSibling' of undefined
Todo._handleKeyPress
  22 |    
  23 |    e.preventDefault();
  24 | 
> 25 |    let next = this.refs[field.name].nextSibling;
     | ^  26 |    if (next && next.tagName === "INPUT") {
  27 |      this.refs[field.name].nextSibling.focus();
  28 |    }




import ReactDOM from "react-dom";
import React, { Component } from "react";
import "./style.css";

class Todo extends Component {
  constructor(props) {
    super(props); // create a ref to store the textInput DOM element

    this.state= {

    }


    this.textInput1 = React.createRef(); …
Run Code Online (Sandbox Code Playgroud)

javascript dom reactjs

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

Mongoose $lookup 对象返回空数组

我已经尝试过其他类似的问题,但似乎对我没有任何作用。我有两个集合:

领导

const mongoose = require("mongoose");
const id = mongoose.Schema.Types.ObjectId;

const leadsSchema = mongoose.Schema(
  {
    _id: id,
    userId: { type: id, ref: "User", required: true },
    leadName: String,
    leads: [
      {
        _id: id,
        name: String,
        status: { type: String, required: false, default: "New" },
        leadActivity: { type: String, required: false, default: "No Campaign Set" },
        headline: { type: String, required: false },
        location: { type: String, required: false },
        leadType: { type: id, ref: "LeadsCategory", required: true },
      } …
Run Code Online (Sandbox Code Playgroud)

aggregate mongoose node.js

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

设置日期选择器onChange的状态

我正在尝试使用html日期选择器基于当前选择的日期更新我的两个状态。两种状态;startdate和enddate,它们都没有在onChange上更新。基于这些更新的状态,我需要使用这些状态数据作为查询参数来获取数据。它仅控制台初始状态日期。

这是代码:

import React, { Component } from "react";
import axios from "axios";

export default class Main extends Component {
  constructor() {
    super();


    var date = new Date();


    var newdate =
      date.getFullYear() +
      "-" +
      ("0" + (date.getMonth() + 1)) +
      "-" + 
      ("0" + (date.getDate())) ;



    this.state = {
      startdate: newdate,
      enddate: newdate,
      clicked: false
    };
  }


  setStartDate = e => {
      this.setState({
        startdate: e.target.value
      })

      console.log(this.state.startdate, 'STARTDATE');
  }



  setEndDate = e => {
    //console.log(e.target.value)

    this.setState({
      enddate: e.target.value,
    }); …
Run Code Online (Sandbox Code Playgroud)

javascript datetime onchange reactjs

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

过滤数据数组多个值javascript

我知道这个问题以前曾被问过,但现有的解决方案似乎不适用于我的情况。我试图根据各种对象数组中的多个属性/值来过滤数据。

我的样本数据如下所示:

const products = [
          { name: 'A', color: 'Blue', size: 50, locations: 'USA' },
          { name: 'B', color: 'Blue', size: 60, locations: 'Europe' },
          { name: 'C', color: 'Blue', size: 30, locations: 'Europe' },
          { name: 'D', color: 'Black', size: 70, locations: 'Japan' },
          { name: 'E', color: 'Green', size: 50, locations: 'Europe' },
          { name: 'F', color: 'Blue', size: 50, locations: 'Brazil' },
          { name: 'G', color: 'Black', size: 40, locations: 'Australia' },
        ];
Run Code Online (Sandbox Code Playgroud)

这就是我要求的过滤结果:

const filters_one …
Run Code Online (Sandbox Code Playgroud)

javascript arrays

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

自定义字体大小 Highchart 词云

我发现了一篇 官方的 highcharts 文章,定义了词云自定义字体大小的方法。

任何人都可以帮助如何在react highcharts中实现deriveFont功能来调整wordcloud字体大小?

import React from 'react';
import Highcharts from 'highcharts';
import HighchartsReact from 'highcharts-react-official';

require('highcharts/modules/wordcloud.js')(Highcharts);



    const Word = (props) => {

            const options = {
                series: [{
                    colors: ['#28B463', '#27AE60', '#186A3B', '#ABEBC6', '#73C6B6'],
                    type: 'wordcloud',             
                    data: props.positcloud, //passing the data from props
                    name: 'Count'
                }],
                title: {
                    text: ''
                },
                chart: {

                    height: 330,
                    margin: 15,
                    type: 'line'
                  },

            };

            return (
                <div>
                    {/* React wrapper for Highcharts */}
                    <HighchartsReact 
                    highcharts={Highcharts} …
Run Code Online (Sandbox Code Playgroud)

highcharts reactjs

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

更改 createMaterialTopTabNavigator 默认样式

我的应用程序中有 createMaterialTopTabNavigator 和三个选项卡。这三个选项卡本身属于不同的 createStackNavigators。我已将抽屉图标作为我的标题权传递给 createMaterialTopTabNavigator。

我想编辑 createMaterialTopTabNavigator 选项卡的背景颜色,但它被我的 HeaderRight 图标样式覆盖。

const Daily = createStackNavigator(
  {
    Daily: {
      screen: DailyStack,
    },

    Another:{
      screen: Another,
    }
  },
  {
    headerMode:'none'
  },
);

const Monthly = createStackNavigator({
  Monthly: {
    screen: MonthlyStack,
  },
},
{
  headerMode:'none'
});


const Range = createStackNavigator({
  Range: {
    screen: RangeStack,
  }
},
{
  headerMode:'none'
});



    const DashboardTabNavigator = createMaterialTopTabNavigator(
      {
        Daily,
        Monthly,
        Range
      },

      {
        navigationOptions: ({ navigation }) => {
          return {
            // tabBarOptions:{
            //   indicatorStyle: {
            //     backgroundColor: …
Run Code Online (Sandbox Code Playgroud)

css navigation tabs react-native

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

"message": "ENOENT:没有那个文件或目录,打开'E:\\astrology\\utils\\uploads\\1600798534862qf.png'"

正如标题所暗示的,error: {"message": "ENOENT: no such file or directory, open 'E:\\astrology\\utils\\uploads\\1600798534862qf.png'"}即使在通过了所有必需的配置之后,我还是会进入我的项目。

注意:我将“app”分为两部分:主要的“app.js”和“appRoute.js”是为了更动态和更清晰的代码。

应用程序.js

const express = require("express");
const path = require("path");

const app = express();
const directory = path.join(__dirname, "utils/uploads");
app.use("/uploads", express.static(directory));

require("./config/database/db")();
require("./config/approutes/appRoutes")(app);

module.exports = app;
Run Code Online (Sandbox Code Playgroud)

appRoute.js

require("dotenv").config();

const morgan = require("morgan");
const bodyParser = require("body-parser");
const cors = require("cors");

const productRoutes = require("../../api/routes/products");

module.exports = function (app) {
  app.use(morgan("dev"));

  app.use(bodyParser.urlencoded({ extended: true, limit: "100mb" }));
  app.use(bodyParser.json());

  app.use(cors({ credentials: true, origin: true }));

  app.use("/products", productRoutes);
  
  app.use((req, res, next) …
Run Code Online (Sandbox Code Playgroud)

node.js express multer

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