如何解析JSX兒童

Question

我在網上搜索過。 create元素被稱爲兒童作爲字符串而不是對象感謝您的幫助

這是代碼

export function createElement(tag: string, props?: any, ...children: JSX.Element[]){ 
    let el = "<"+tag+">"; 

    if(props != undefined){ 
     for(let i of children){ 
      if(i == undefined) 
       throw new Error("Excepted class got undefined"); 
      else{ 

      } 
     } 
    } 
    el+= "</"+tag+">"; 

    return el; 
} 

我怎樣才能確保兒童不串

Answer 1

解析JSX字符串數組「在飛行中「轉換爲相應的JSX.Element實例是一項相當大的功能，並且很可能需要使用tsc來將生成的字符串轉換爲相應的類。不幸的是，到目前爲止，我還沒有看到任何可接受的解決方案。

另一方面，在大多數情況下，我看到你實際上並不需要解析任意的JSX字符串。它適用於您正在處理有限的可能元素集並且以類似方式實例化時。在你的例子中，你可能會用簡單的開關逃脫：

let ComponentClass; 

switch(tag) 
{ 
    case "MyComponent": 
     ComponentClass = MyComponent; 
    break; 

    case "MyOtherComponent": 
     ComponentClass = MyOtherComponent; 
    break; 

    // Other cases/default comes here 
} 

return <ComponentClass {...props}>{children}</ComponentClass>;