小编nor*_*ial的帖子

如何等到 Loop 内的语音完成?

我想暂停/等待 for 循环,直到window.speechSynthesis.speak(audio)完成阅读文本,然后再进行下一次迭代。我有以下代码:

 var all = "Oak is strong and also gives shade \n \
    Cats and dogs each hate the other \n \
    The pipe began to rust while new \n Bye."


 sentences = all.split('\n')
      for (i = 0; i < sentences.length; i++) {
        sentence = sentences[i]
        console.log(sentences[i]);
        audio = new SpeechSynthesisUtterance(sentence)
        window.speechSynthesis.speak(audio)
         } 
Run Code Online (Sandbox Code Playgroud)

现在我想要的是,每个sentences[i]打印一次。在完成sentences[i]之前不会打印 下一个window.speechSynthesis.speak(audio),一旦语音完成,sentences[i] 则将打印下一次迭代。

那么我怎样才能让循环等到一个函数没有完成呢?

注意:我可以让它等待一个恒定的时间,但我想要一个动态的等待,即等待时间应该window.speechSynthesis.speak(audio)与完成文本所需的时间一样长。

javascript text-to-speech wait

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

如何在 es6 中启用 ts-check

最近我发现 Visual Code 有一个很好的功能,可以在 JavaScript 文件中进行类型检查。我所要做的就是在文件顶部输入 // @ts-check,这对我来说有很大的好处,所以我想在每个 JavaScript 文件上全局使用它,我怎样才能做到这一点而不每次都在文件顶部写入该行?

javascript typescript reactjs eslint

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

useReducer 中返回参数的通用类型

我正在编写一个自定义钩子来从 API 获取一些数据。如果可能,我希望返回的数据是类型安全的。这可以用泛型来完成吗?

type Action = { type: 'PENDING' } | { type: 'SUCCESS'; payload: any } | { type: 'FAIL' };

interface State {
  isLoading: boolean;
  isError: boolean;
  data: any;
}

const dataFetchReducer = (state: State, action: Action): State => {
  switch (action.type) {
    case 'PENDING':
      return {
        ...state,
        isLoading: true,
      };
    case 'SUCCESS': {
      return {
        ...state,
        isLoading: false,
        isError: false,
        data: action.payload,
      };
    }
    case 'FAIL':
      return {
        ...state,
        isLoading: false,
        isError: true,
      };
    default:
      throw new …
Run Code Online (Sandbox Code Playgroud)

generics typescript reactjs react-hooks

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

在调试 azure 持久函数时清除历史记录

持久函数在存储中保持一个状态,这就是使它们工作的原因,但是在调试和开发时非常麻烦。我有大量未完成的运行,并且系统在我启动该过程时尝试再次运行。一些运行具有相同的错误数据,这会导致异常,而另一些运行由于某些事情没有按预期工作而提前终止。

我不想在调试中启动我的应用程序时运行所有旧案例(针对我的本地存储帐户运行)。如何自动清除所有数据,以便仅触发新功能?

azure-functions azure-durable-functions

6
推荐指数
3
解决办法
2911
查看次数

添加溢出属性时材质UI奇怪的蓝线

我在React 应用程序中使用Material-UI。我也在使用样式组件,并且正在 Chrome 浏览器中查看该应用程序。使用 Firefox 浏览器时不会出现我遇到的问题。

在我的样式组件中应用溢出属性时,我看到这条蓝线指向模态底部。这仅在我使用浏览器窗口的大小进行播放时出现。当我逐渐使浏览器窗口接近正常大小时,线条消失了。我不确定这是为什么,或者我能做些什么来解决它。

这是我的代码片段:

export const ScrollableModal = styled(MUIModal)(() => ({
  overflow: 'scroll',
}));

const Modal = ({ title, children, actionsLeft, actionsRight, ...rest }) => {
  const wrappedTitle =
    typeof title === 'string' ? <Typography>{title}</Typography> : title;

  return (
    <ScrollableModal {...rest}>
      <Container>
Run Code Online (Sandbox Code Playgroud)

我忽略了其余部分,因为它与我的问题无关。

这是我所描述的截图:

截屏

javascript google-chrome reactjs material-ui

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

如果选项卡关闭,“fetch”调用会继续吗?

浏览器现在提供Fetch API,您可以通过 JavaScript 发出网络请求,如下所示:

const response = await fetch('http://example.com/movies.json');
const myJson = await response.json();
Run Code Online (Sandbox Code Playgroud)

如果用户关闭调用fetch和履行承诺之间的选项卡,会发生什么?浏览器会丢弃请求吗?如果对 的调用fetch发生在unloadbeforeunload事件中怎么办?

我知道sendBeaconAPI 调用就是用于此目的的,但我想知道sendBeacon现在我们有了fetch.

javascript browser fetch-api

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

错误模块构建失败(来自 ./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js)

当我运行时出现ng build --prod此错误。它可以正常运行,但无法构建。我接力与那个绑在一起

ERROR in Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/mini-css-extract-plugin/dist/loader.js):       
TypeError: Cannot read property 'replace' of undefined
    at normalizeBackSlashDirection (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\RequestShortener.js:16:17)  
    at new RequestShortener (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\RequestShortener.js:26:15)
    at new Compiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compiler.js:195:27)
    at Compiler.createChildCompiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compiler.js:548:25)        
    at Compilation.createChildCompiler (C:\project\tea supply chain mangement system\test2\node_modules\webpack\lib\Compilation.js:2100:24) 
    at Object.pitch (C:\project\tea supply chain mangement system\test2\node_modules\@angular-devkit\build-angular\node_modules\mini-css-extract-plugin\dist\loader.js:89:43)
Run Code Online (Sandbox Code Playgroud)

我的依赖:

"dependencies": {
  "@agm/core": "^1.1.0",
    "@angular/animations": "8.2.14",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "8.2.14",
    "@angular/compiler": "8.2.14",
    "@angular/core": "^8.2.14",
    "@angular/http": "^7.2.15", …
Run Code Online (Sandbox Code Playgroud)

angular

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

以与另一个数组相同的方式对一个数组进行排序 JavaScript

我有 2 个数组:

[2, 4, -2, 4, 1, 3]
["a", "b", "c", "d", "e", "f"]
Run Code Online (Sandbox Code Playgroud)

我希望它们按数值数组排序:

// output
[-2, 1, 2, 3, 4, 4] // <-sorted by numerical order
["c", "e", "a", "f", "b", "d"] // sorted exactly the same order as the first array
Run Code Online (Sandbox Code Playgroud)

虽然如果 "b" 或 "d" 先出现实际上并不重要(在这个例子中它们都有 4 个)

我在网上发现了很多关于这个的问题,但没有一个对我有用,谁能帮我解决这个问题?

javascript arrays sorting

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

Azure DevOps 中发布管道工件的文件模式

最近刚刚构建了一个Azure Pipeline,其中在一个阶段,工件暂存目录中有不同的 zip 文件。我想要实现的是将带有任务的暂存文件夹中的所有zip 文件发布到放置文件夹。PublishPipelineArtifact

我在工件暂存目录中有 2 个存档的 zip 文件:

  1. $(Build.ArtifactStagingDirectory)/$(Build.BuildId).zip
  2. $(Build.ArtifactStagingDirectory)/cli_scripts_$(Build.BuildId).zip

在我的azure-pipelines.yml文件中,请找到发布任务:

- task: PublishPipelineArtifact@0
  displayName: 'Publish pipeline artifacts'
  inputs:
    targetPath: $(Build.ArtifactStagingDirectory)/**
Run Code Online (Sandbox Code Playgroud)

这给出了以下错误:

[错误] 路径不存在:d:\a\1\a**

我也已经尝试过以下操作,但都没有工作:

$(Build.ArtifactStagingDirectory)/**
$(Build.ArtifactStagingDirectory)/**/*.zip
$(Build.ArtifactStagingDirectory)/*.zip
Run Code Online (Sandbox Code Playgroud)

题:

targetPath从该文件夹移动所有 zip 文件的模式是什么?

任何帮助表示赞赏!

continuous-integration yaml azure azure-devops azure-pipelines

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

从 Ant Design 导入 RangeValue 类型

正在根据Ant Design的文档进行更新,以将 Moment.js 替换date-fns,该文档似乎运行良好。DatePicker

主要建议创建以下内容:

import dateFnsGenerateConfig from 'rc-picker/lib/generate/dateFns'
import generatePicker from 'antd/es/date-picker/generatePicker'

const DatePicker = generatePicker<Date>(dateFnsGenerateConfig)
Run Code Online (Sandbox Code Playgroud)

然后使用如下组件:

<DatePicker.RangePicker
          placeholder={['From', 'To']}
          onChange={range => setRange(range)}
          value={range}
/>
Run Code Online (Sandbox Code Playgroud)

对于上述情况,已使用类型创建了以下状态RangeValue

const [range, setRange] = useState<RangeValue<Date>>(
   [from, to]
)
Run Code Online (Sandbox Code Playgroud)

RangeValue类型已导入如下:

import { RangeValue } from 'rc-picker/lib/interface'

// technically:
// import { RangeValue } from '../../../../node_modules/rc-picker/lib/interface'
Run Code Online (Sandbox Code Playgroud)

问题:

我在我们进行类似对话的一个问题中只找到了这条评论。

有没有办法导入RangeValue类型,也许是从 Ant Design 导入?谢谢你!

typescript reactjs antd ant-design-pro

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