小编use*_*274的帖子

React Developer Tool 是否有可能显示使用 useState 创建的状态变量的名称?

我正在学习react-hooks,我使用useState创建了一系列状态变量,在尝试调试并查看其值时,我发现React Developer Tool没有显示分配给状态变量的名称,而是显示文本状态,这很不方便不可能从一开始就确定哪个变量是试图调试的变量

在此处输入图片说明

更新 1

这是当前的源代码

import React, { useState, useEffect, Fragment } from "react";

function Main() {
  const [data, setData] = useState({ hits: [] });
  const [query, setQuery] = useState("redux");
  const [url, setUrl] = useState(
    "https://hn.algolia.com/api/v1/search?query=redux"
  );
  const [isLoading, setIsLoading] = useState(false);
  const [isError, setIsError] = useState(false);

  useEffect(() => {
    const fetchData = async () => {
      setIsError(false);
      setIsLoading(true);

      try {
        const response = await fetch(url);
        const json = await response.json();

        setData(json);
      } catch (e) {
        setIsError(true);
      }

      setIsLoading(false); …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks

11
推荐指数
3
解决办法
2499
查看次数

如何使用Curl和SSL以及cookie登录

我一直试图用卷曲登录barnesandnoble.com移动网站,到目前为止没有运气.我没有错误地返回页面,它将我的电子邮件再次默认为登录页面的电子邮件输入表单框(从print $ result返回的表单).

通过将LOGINURL更改为指向ebay的登录名,相同的代码实际上可以让我正确进入ebay

唯一的区别是barnesandnobles是https://和ebay登录是http://

另外,我相信barnes网站是asp/aspx所以我不知道如何处理cookie和_state不同

任何帮助将不胜感激,因为我一直试图在过去的16小时内调试这个

另外,我的cookie.txt可写并正常工作

<?php
    $cookie_file_path = "C:/test/cookie.txt";
    $LOGINURL = "https://cart2.barnesandnoble.com/mobileacct/op.asp?stage=signIn"; 
    $agent = "Nokia-Communicator-WWW-Browser/2.0 (Geos 3.0 Nokia-9000i)";

    $ch = curl_init(); 

    $headers[] = "Accept: */*";
    $headers[] = "Connection: Keep-Alive";
    $headers[] = "Content-type: application/x-www-form-urlencoded;charset=UTF-8";

    curl_setopt($ch, CURLOPT_HTTPHEADER,  $headers);
    curl_setopt($ch, CURLOPT_HEADER,  0);
    curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch, CURLOPT_URL, $LOGINURL);
    curl_setopt($ch, CURLOPT_USERAGENT, $agent);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
    curl_setopt($ch, CURLOPT_COOKIEFILE, $cookie_file_path);
    curl_setopt($ch, CURLOPT_COOKIEJAR, $cookie_file_path);

    $content = curl_exec($ch); 

    curl_close($ch); 

    unset($ch); 

    // NAME="path_state" value="6657403">

    if(stristr($content,"path_state")){
        $array1 = explode('path_state" value="',$content);
        $content1 …
Run Code Online (Sandbox Code Playgroud)

php forms cookies ssl curl

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

ReactJS显示onClick的获取响应

我在ReactJS项目上工作,您可以在按下生成按钮时生成随机活动.我正在对我的api进行提取以显示其中的一些数据.这很好用.现在,我想在每次单击"生成"按钮(位于主组件中)时执行提取并显示返回的数据.因此,生成按钮必须执行新的提取并刷新组件.默认情况下它也必须为空.我搜索了一段时间,找不到相关的答案.你们有些人可以帮助我吗?谢谢.

获取组件

import React from "react";

export class ItemLister extends React.Component {
    constructor() {
        super();
        this.state = { suggestion: "" };
    }

    componentDidMount() {
        fetch("......./suggestions/random", {
            method: "GET",
            dataType: "JSON",
            headers: {
                "Content-Type": "application/json; charset=utf-8"
            }
        })
            .then(resp => {
                return resp.json();
            })
            .then(data => {
                this.setState({ suggestion: data.suggestion });
            })
            .catch(error => {
                console.log(error, "catch the hoop");
            });
    }

    render() {
        return <h2>{this.state.suggestion}</h2>;
    }
}
Run Code Online (Sandbox Code Playgroud)

家庭组件

import React from "react";
import { ItemLister } from "./apiCall";

export class Home …
Run Code Online (Sandbox Code Playgroud)

fetch reactjs

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

使用变量作为键和值创建对象

我正在学习反应,我正在按照快速入门指南,在主题提升状态我找到了计算器组件

class Calculator extends React.Component {
    constructor(props) {
      super(props);

      ...

      this.state = {scale: 'c', temperature: ''}
    }

    handleCelsiusChange(temperature) {
      this.setState({scale: 'c', temperature})
    }

    handleFahrenheitChange(temperature) {
      this.setState({scale: 'f', temperature});
    }

    render() {
      ...

      return (
        <div>
          ...
        </div>
      )
    }
  }
Run Code Online (Sandbox Code Playgroud)

我的问题是this.setState({scale: 'c', temperature})我期待的这句话this.setState({scale: 'c', temperature: temperature}).

这个temperature分配有些反应是辛糖吗?你能解释一下为什么会这样吗?

谢谢

javascript ecmascript-6 reactjs

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

如何在模板文字中呈现HTML?

我解释了我的情况,用户通过持久化在数据库中的WYSIWYG编辑器输入内容,在应用程序的另一个位置,此内容和另一个通过ajax请求获得,这里我使用模板文字来构建带有最终使用innerHTML目标DOM元素插入视图中的数据。

我要求通过WYSIWYG编辑器添加的内容显示为html,使用lodash函数_.unescape ()可以获取html特殊字符的免费内容,但这不是显示为html,而是显示为html字符串

我分享实现的总体思路:

模板文字

`...
<div>${getHTML(dataset.message)}</div>
...`
Run Code Online (Sandbox Code Playgroud)

Java脚本

function getHTML(message) {
    const html = _.unescape(message).replace('\\', '');
    const parser = new DOMParser();
    const dom = parser.parseFromString(html, 'text/html')

    return dom;
}
Run Code Online (Sandbox Code Playgroud)

输出量

[object HTMLDocument]
Run Code Online (Sandbox Code Playgroud)

例如,如果domhtml在视图中返回变量而不是变量,则<p>some content <strong>goes here</strong></ p>需要将该内容显示为常规视图html

关于将内容显示为html有什么想法吗?

谢谢

html javascript

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

如果未定义值,如何不在对象中包含字段

我有以下功能

const exampleFunction = (var1, var2, var3) => {
    return const targetObject = {
        var1,
        var2,
        var3,
    },
};
Run Code Online (Sandbox Code Playgroud)

var2和var3是可选变量.

如果所有3个变量都发送到这个函数,那么我需要返回带有3个字段的对象.

如果var2未定义,我需要返回仅包含2个字段的对象.如果var3未定义,我需要返回仅包含2个字段的对象.

如果var2和var3未定义,我需要返回仅包含1个字段的对象.

javascript

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

如何使用用户定义的等式计算HTML表列(使用javascript或jquery)

我需要一些帮助,使用来自其他列的数据并使用用户定义的等式动态计算HTML表格列.

例如,如果用户将等式C1 + C2 * 0.5 + C3 * 0.8输入到输入框中,则表​​格需要根据等式中定义的列中的数据计算最后一列(C1 =列1,C2 =列2 ...).

我的表数据如下所示:

Student ID | Homework 1 | Homework 2 | Exam points | Final Grade
1            8.75         7.60         55.50         -
2            9.00         4.50         63.00         -
3            7.75         7.40         45.50         -
Run Code Online (Sandbox Code Playgroud)

如果用户在C1 + C2 * 0.5 + C3 * 0.8输入中输入等式,则表格应执行操作并根据该等式填充最终等级列.

结果看起来应该是这样的.

Student ID | Homework 1 | Homework 2 | Exam points | Final Grade
1            8.75         7.60         55.50         56.95
2            9.00         4.50         63.00 …
Run Code Online (Sandbox Code Playgroud)

html javascript math jquery

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

在由 create-react-app 创建的环境中获取本地 JSON 文件时出现 JSON 解析错误

我正在学习 reactjs 并且我正在使用create-react-app 创建的环境。我正在尝试从本地 json 文件中获取 json 数据,但是我收到错误消息SyntaxError: "JSON.parse: unexpected character at line 1 column 1 of the JSON data"在这个SO 答案中,我明白我需要添加一个协议,但是在添加它之后我得到了同样的错误。这是我正在尝试的组件

import React, { Component } from "react";

class Countries extends Component {
    constructor(props) {
        super(props);

        this.state = {
            countries: []
        };
    }

    componentDidMount() {
        fetch("http://localhost:3000/dataset.json")
            .then(response => response.json())
            .then(json => {
                console.log(json);
            })
            .catch(error => console.error(error));
    }

    render() {
        const countries = this.state.countries;
        const rows = countries.map(country => (
            <Country name={country.name} code={country.code} /> …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

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

如何在grails约束中设置一个固定长度的String?

我有这个域类

class Client {
  String idCard
  ...

  static constraints = {
    idCard size:16
    ...
  }
}
Run Code Online (Sandbox Code Playgroud)

我在bootstrap.groovy文件中创建了一些测试数据

但我收到以下错误消息

Caused by IllegalArgumentException: Parameter for constraint [size] of property [idCard] of class [class ni.sb.Client] must be a of type [groovy.lang.IntRange]
Run Code Online (Sandbox Code Playgroud)

我需要这个属性是一个字符串,并具有固定的长度

我遵循大小限制文档但没有成功

谢谢你的时间

grails

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

当上一个 api 成功完成后,如何对 api 进行新的调用?

我是 Angular 和 rxjs 的新手,我有以下场景,在该场景中,我需要在成功解析对 api 的调用后进行新的调用,在 Angular / rxjs 的上下文中我不知道该怎么做它

handler(): void {
  this.serviceNAme
    .createDirectory(this.path)
    .pipe(
      finalize(() => {
        this.someProperty = false;
      })
    )
    .subscribe(
      (data) => console.log(data),
      (error) => console.error(error.message)
    );
}
Run Code Online (Sandbox Code Playgroud)

当上一个 api 成功调用时,重新调用 api 的正确方法是什么?

javascript rxjs angular

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

标签 统计

javascript ×7

reactjs ×4

html ×2

angular ×1

cookies ×1

curl ×1

ecmascript-6 ×1

fetch ×1

forms ×1

grails ×1

jquery ×1

math ×1

php ×1

react-hooks ×1

rxjs ×1

ssl ×1