程序问答   发布时间:2022-06-01  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了RxJS switchMap/mergeMap 导致 Obserable<unknown>大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

如何解决RxJS switchMap/mergeMap 导致 Obserable<unknown>?

开发过程中遇到RxJS switchMap/mergeMap 导致 Obserable<unknown>的问题如何解决?下面主要结合日常开发的经验,给出你关于RxJS switchMap/mergeMap 导致 Obserable<unknown>的解决方法建议,希望对你解决RxJS switchMap/mergeMap 导致 Obserable<unknown>有所启发或帮助;

介绍

@H_419_2@我正在尝试在 TypeScript 项目中使用 RxJs,但在使用 switchMap 和 @H_290_4@mergeMap 管道运算符时我看到了奇怪的行为,其中类型在某处丢失。我有单独的 TypeScript 项目(react 应用程序),其中包含相@R_624_11197@的 RxJs,但我没有看到这种行为。这两个项目都由相@R_624_11197@的 TypeScript (4.2.3) 进行评估。我不知道什么可能是错的,任何帮助将不胜感激。

上下文

@H_419_2@这是我创建的一个简单的测试用例来演示问题。将此代码复制到我的其他项目中可以编译并按预期工作。如您所见,我有一个源流或类型 Observable<number>,当我将其映射到 String 时,输出类型是 Observable<String>,这是正确的。但是,当我应用 switchMap 并返回一个字符串流时,对管道的调用发出的类型是 Observable<unkNown>

@H_419_2@

RxJS switchMap/mergeMap 导致 Obserable<unknown>

@H_419_2@在这里您可以看到 IDE 突出显示了类型不匹配

@H_419_2@

RxJS switchMap/mergeMap 导致 Obserable<unknown>

@H_419_2@我检查了 switchMap 操作本身的类型,表明该类型被正确地推断出来,但该类型在返回值中丢失了。我检查了 OperatorFunction 类型,没有发现任何问题(在其他项目中也没有什么不同)

@H_419_2@

RxJS switchMap/mergeMap 导致 Obserable<unknown>

配置

@H_419_2@鉴于上述问题以及这在另一个项目中有效的事实,让我认为问题出在我的 TypeScript 配置中。打开和关闭东西半小时后,我似乎看到了一丝希望,但没有任何效果。这是我的 tsconfig.Json,我使用的是 TypeScript 4.2.3:

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig.Json to read more about this file */

    /* Basic Options */
    // "incremental": true,/* Enable incremental compilation */
    "target": "es5",/* Specify ECMAScript target version: 'ES3' (default),'ES5','ES2015','ES2016','ES2017','ES2018','ES2019','ES2020',or 'ESNEXT'. */
    "module": "commonjs",/* Specify module code generation: 'none','commonjs','amd','system','umd','es2015','ES2020',or 'ESNext'. */
    // "lib": [],/* Specify library files to be included in the compilation. */
    // "allowJs": true,/* Allow JavaScript files to be compiled. */
    // "checkJs": true,/* Report errors in .Js files. */
    // "Jsx": "preserve",/* Specify JsX code generation: 'preserve','react-native','react','react-Jsx' or 'react-Jsxdev'. */
     "declaration": true,/* Generates corresponding '.d.ts' file. */
     "declarationMap": true,/* Generates a sourcemap for each corresponding '.d.ts' file. */
     "sourceMap": true,/* Generates corresponding '.map' file. */
    // "outfile": "./",/* Concatenate and emit output to single file. */
     "outDir": "./lib",/* Redirect output structure to the directory. */
    // "rootDir": "./",/* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
    // "composite": true,/* Enable project compilation */
    // "tsBuildInfofile": "./",/* Specify file to store incremental compilation information */
    // "removeComments": true,/* Do not emit comments to output. */
    // "noEmit": true,/* Do not emit outputs. */
    // "importHelpers": true,/* import emit Helpers from 'tslib'. */
    // "downleveliteration": true,/* ProvIDe full support for iterables in 'for-of',spread,and destructuring when targeTing 'ES5' or 'ES3'. */
    // "isolatedModules": true,/* Transpile each file as a separate module (SIMILAR TO 'ts.transpileModule'). */

    /* Strict Type-checking Options */
    "Strict": true,/* Enable all Strict type-checking options. */
     "noImplicitAny": true,/* Raise error on Expressions and declarations with an implIEd 'any' type. */
     "Strictnullchecks": true,/* Enable Strict null checks. */
     "StrictFunctionTypes": true,/* Enable Strict checking of function types. */
     "StrictBindCallApply": true,/* Enable Strict 'bind','call',and 'apply' methods on functions. */
     "StrictPropertyInitialization": true,/* Enable Strict checking of property initialization in classes. */
     "noImplicitThis": true,/* Raise error on 'this' Expressions with an implIEd 'any' type. */
     "alwaysStrict": true,/* Parse in Strict mode and emit "use Strict" for each source file. */

    /* Additional checks */
     "noUnusedLocals": true,/* Report errors on unused locals. */
     "noUnusedParameters": true,/* Report errors on unused parameters. */
     "noImplicitReturns": true,/* Report error when not all code paths in function return a value. */
     "nofallthroughCasesInSwitch": true,/* Report errors for fallthrough cases in switch statement. */
//     "noUncheckedindexedAccess": false,/* Include 'undefined' in index signature results */
//     "nopropertyAccessFromIndexSignature": false,/* require undeclared propertIEs from index signatures to use element accesses. */

    /* Module Resolution Options */
    // "moduleResolution": "node",/* Specify module resolution strategy: 'node' (Node.Js) or 'classic' (TypeScript pre-1.6). */
    // "baseUrl": "./",/* Base directory to resolve non-absolute module names. */
    // "paths": {},/* A serIEs of entrIEs which re-map imports to lookup LOCATIOns relative to the 'baseUrl'. */
    // "rootDirs": [],/* List of root folders whose combined content represents the structure of the project at runtime. */
    // "typeRoots": [],/* List of folders to include type deFinitions from. */
    // "types": [],/* Type declaration files to be included in compilation. */
    // "allowSyntheticDefaultimports": true,/* Allow default imports from modules with no default export. This does not affect code emit,just typechecking. */
    "esModuleInterop": true,/* Enables emit interoperability between Commonjs and ES Modules via creation of namespace objects for all imports. ImplIEs 'allowSyntheticDefaultimports'. */
    // "preserveSymlinks": true,/* Do not resolve the real path of symlinks. */
    // "allowUmdGlobalAccess": true,/* Allow accessing UMD globals from modules. */

    /* source Map Options */
    // "sourceRoot": "",/* Specify the LOCATIOn where deBUGger should locate TypeScript files instead of source LOCATIOns. */
    // "mapRoot": "",/* Specify the LOCATIOn where deBUGger should locate map files instead of generated LOCATIOns. */
    // "inlinesourceMap": true,/* Emit a single file with source maps instead of having a separate file. */
    // "inlinesources": true,/* Emit the source alongsIDe the sourcemaps within a single file; requires '--inlinesourceMap' or '--sourceMap' to be set. */

    /* Experimental Options */
     "experimentalDecorators": true,/* Enables experimental support for ES7 decorators. */
     "emitDecoratorMetadata": true,/* Enables experimental support for emitTing type Metadata for decorators. */

    /* Advanced Options */
    "skiplibcheck": true,/* Skip type checking of declaration files. */
    "forceConsistentCasingInfilenames": true,/* disallow inconsistently-cased references to the same file. */
    "lib": [
      "dom","es5","scripthost","es2015.collection","es2015.promise"
    ]
  },"include": ["./src/**/*.ts"],"exclude": ["./node_modules/**/*"]
}
@H_419_2@为了完整起见,这里是上面图片中的代码

import { Observable,of } from "rxJs";
import { map,switchMap } from "rxJs/operators";

const source = new Observable<number>();

const switchMapToString: Observable<String> = source.pipe(
    switchMap(n => of(`${n}`)),);

const mapToString: Observable<String> = source.pipe(
    map(n => `${n}`),);

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

大佬总结

以上是大佬教程为你收集整理的RxJS switchMap/mergeMap 导致 Obserable<unknown>全部内容,希望文章能够帮你解决RxJS switchMap/mergeMap 导致 Obserable<unknown>所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:导致