小编blu*_*ris的帖子

React:在图像加载时显示加载微调器

我有一个 React 应用程序,它调用useEffect我的 API,它返回一个 URL 列表,用作 imy 图像 srcs。

我正在使用react-loader-spinner在我的图像加载时显示加载微调组件。

我有一个loading变量useState来确定图像是否正在加载。

我不知道如何停止显示加载微调器并在它们全部加载后显示我的图像。

这是我的代码:

照片.jsx

import React, { useState, useEffect, Fragment } from 'react'
import Loader from 'react-loader-spinner';
import { getAllImages } from '../../services/media.service';
import Photo from '../common/Photo';

const Photos = () => {
  const [photos, setPhotos] = useState([]);
  const [loading, setLoading] = useState(false);

  useEffect(() => {
      setLoading(true);
      getAllImages()
        .then(results => {
          setPhotos(results.data)
          console.log(results.data)
        })
        .catch(err =>{
          console.log(err)
        })
  }, [])

  const handleLoading …
Run Code Online (Sandbox Code Playgroud)

image loading spinner reactjs

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

对象不支持属性或方法“条目” - IE11 中的错误

我正在开发一个使用 create-react-app 引导的 React 应用程序,它在 Chrome 中运行良好,但我无法让它在 IE11 中运行。

启动应用程序后,我从控制台收到以下错误:

Object doesn't support property or method 'entries'

我花了好几个小时在谷歌上搜索,试图找到一个解决方案,但没有一个推荐的方法有效。

我尝试过的事情:

  • 进口react-app-polyfill/ie11react-app-polyfill/stable在顶部index.js
  • 进口core-js/es/object/entriescore-js/features/object/entries在顶部index.js
  • 将以下内容添加到index.js
if (!Object.entries) {
  Object.entries = function( obj ){
    var ownProps = Object.keys( obj ),
        i = ownProps.length,
        resArray = new Array(i); // preallocate the Array
    while (i--)
      resArray[i] = [ownProps[i], obj[ownProps[i]]];

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

包.json:

{
  "name": "ceas-ui",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "auth0-js": …
Run Code Online (Sandbox Code Playgroud)

internet-explorer-11 reactjs create-react-app core-js

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

如何在angular4中处理自动标签

在第一个文本框中输入文本后,我需要移动下一个文本框。在第一个选项卡中键入文本后,它必须自动移动到下一个选项卡。

<div class="autotabbed-container">
  <div id="example1" class="autotabbed">
    <h3>Bank sort code: XX-XX-XX</h3>
    <input type="text" maxlength="2" size="2" />
    -
    <input type="text" maxlength="2" size="2" />
    -
    <input type="text" maxlength="2" size="2" />
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

当我在第一个文本框中键入文本时,光标需要移动下一个文本框。请帮助如何在角度4中实现这一目标。

如果我想在ngFor中申请,则相同的代码将无法正常工作。在下面的代码中,如果我想显示基于ngFor循环的文本框。在第一个TD中,我将显示密码文本框,在第二个TD中,我将仅显示星号。在这种情况下,我们如何动态应用#input。我只需要指出第一个td项目,而不是下一个td项目。因此,在这种情况下,我们如何实现自动对焦。

<tr>
  <ng-container *ngFor="let i of dynamicArr, let x = index">
    <td *ngIf="i !== '*'">
      <input type="password" #input1 formControlName="dyna{{i}}" id="dyna{{i}}" (input) = "onInputEntry($event, input2)" required maxlength="1" />
    </td>
    <td *ngIf=" i === '*' ">
      <img class="flotado_right" id="starimage" src="starimage.jpg" class="dot-image">        
    </td>
  </ng-container>
</tr>
Run Code Online (Sandbox Code Playgroud)

我正在构建如下所示的动态数组,并且动态文本的值类似2 5和7。在这种情况下,dynamicArr [2] = 1,dynamicArr [5] = 2,dynamicArr …

angular

5
推荐指数
2
解决办法
4192
查看次数

如何在Watson Assistant函数中实现允许在节点中进行异步/等待?

根据Watson Assistant API文档,回调用于返回响应.以下是从他们的API文档中获取的示例:

var watson = require('watson-developer-cloud');

var assistant = new watson.AssistantV1({
  username: '{username}',
  password: '{password}',
  version: '2018-02-16'
});

var params = {
  workspace_id: '9978a49e-ea89-4493-b33d-82298d3db20d',
  intent: 'hello'
};

assistant.listExamples(params, function(err, response) {
  if (err) {
    console.error(err);
  } else {
    console.log(JSON.stringify(response, null, 2));
  }
});
Run Code Online (Sandbox Code Playgroud)

我希望尝试和promisify这个功能,所以我可以将进程转换为一个漂亮,整洁的异步/等待进程,并退出回调地狱.我在AWS Lambda上托管并执行此代码.他们最近发布了LAMBDA的node8.10运行,所以我渴望使用异步/伺机我所有的现有功能转换.

以下是我的尝试(替换了敏感数据):

var Watson = require('watson-developer-cloud');
var util = require('util');

var assistant = new Watson.AssistantV1({
    username: "username",
    password: "password",
    version: "2018-02-16"
});

var params = {
    workspace_id: "workspace_id",
    intent: "acronym"
}; …
Run Code Online (Sandbox Code Playgroud)

amazon-web-services node.js promise async-await watson-conversation

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