我们可以使用通用变量与Typescript进行导入

发布于 2025-02-12 12:09:10 字数 780 浏览 1 评论 0 原文

我搜索了很多东西，寻找一种解决基本通用组件的解决方案。为此，我需要将整个对象数组传递到fundernal组件。

在这个机构组件上，我想使用来自“ dynamicpath”示例的prop的动态值，

我

import myComponentName from myPathVar

想在导入行上使用变量，这些变量来自_props。而且我不知道如何解决这个问题，如果可能的话，

我尝试了此问题，但没有起作用

const path = '../../examples/tagsProjectsa.json';
const abc = import(`${path}`).then(data => {
  console.log(data);
});

但是无法找到模块

更新：要回答这个问题：不，我们不能进行通用导入的ATM，所以我可以通过道具传递界面，这也没有工作 - ＆gt; 道具？

所以我在道具上使用类型来传递通用对象。而且它有效，我无法定义通用类型，因为无法传递接口以获取类型

原文

I searched a lot,for a solution to create a basic generic component.
For this i need to pass throught props an Array of Objects to a functionnal Component.

On this functionnal component i want to use dynamic values coming from Props like import MyDynamicName from "DynamicPath"

Example

import myComponentName from myPathVar

I want to use variables on an import line , this variables coming from _props . And i don't know how to solve this problem and if its possible

i tried this but didn't worked

const path = '../../examples/tagsProjectsa.json';
const abc = import(`${path}`).then(data => {
  console.log(data);
});

but module can't be found

UPDATE :
TO Answer the question : No We can't do generic import atm so i trie to pass interfaces through props and this didn't worked too --> Is there a way to pass down an Interface through props?

So i use type on my props to pass my generic objects. And it worked , i wasn't able to define generic types because can't pass interfaces to get types

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

如果没有 2025-02-19 12:09:10

静态导入无法使用陈述来解决动态说明符。从链接的文档中：

只允许单一引用和双引号的字符串。

但是，您可以使用动态导入。这甚至使用 object urls 代码段下面：

您似乎正在尝试导入JSON数据。请注意，导入JSON数据尚不是规格的一部分，并且需要使用目前只是第三阶段提案。

<script type="module">

const initialData = {message: 'hello world'};

const json = JSON.stringify(initialData);
const blob = new Blob([json], {type: 'application/json'});
const oUrl = URL.createObjectURL(blob);

const {default: importedData} = await import(oUrl, {assert: {type: 'json'}});

const result = importedData.message === initialData.message ? 'Success' : 'Fail';
console.log(result, {initialData, importedData});

// Cleanup object URL data after use
URL.revokeObjectURL(oUrl);

</script>

Static import statements cannot be used to resolve a dynamic specifier. From the linked documentation:

Only single quoted and double quoted Strings are allowed.

However, you can resolve a dynamic specifier (e.g. a string held in a variable) using dynamic import. This even works using object URLs as seen in the code snippet below:

You appear to be attempting to import JSON data. Note that importing JSON data is not yet part of the spec, and that doing so requires using an import assertion which is currently only a stage 3 proposal.

<script type="module">

const initialData = {message: 'hello world'};

const json = JSON.stringify(initialData);
const blob = new Blob([json], {type: 'application/json'});
const oUrl = URL.createObjectURL(blob);

const {default: importedData} = await import(oUrl, {assert: {type: 'json'}});

const result = importedData.message === initialData.message ? 'Success' : 'Fail';
console.log(result, {initialData, importedData});

// Cleanup object URL data after use
URL.revokeObjectURL(oUrl);

</script>

回复收藏 0 原文

~没有更多了~