如何在Svelte中使用props
學習如何在Svelte中使用props，讓具有父子關係的兩個組件彼此通信。 您可以使用import ComponentName from 'componentPath'的語法將Svelte組件引入到任何其他組件中： <script> import SignupForm from './SignupForm.svelte'; </script> 路徑相對於當前組件路徑。./表示“這個相同的文件夾”。您可以使用../回到上一級文件夾，以此類推。 一旦這樣做，您就可以在標記中使用新引入的組件，就像使用HTML標籤一樣： <SignupForm /> 通過這種方式，您正在形成兩個組件之間的父子關係：一個是導入組件，另一個是被導入組件。 通常情況下，您希望父組件將數據傳遞給子組件。 您可以使用props來實現。props的行為類似於純HTML中的屬性，它們是單向通信的形式。 在這個例子中，我們將disabled prop傳遞給它，並將JavaScript值true傳遞給它： <SignupForm disabled={true}/> 在SignupForm組件中，您需要導出disabled prop，如下所示： <script> export let disabled </script> 這是表明該prop對父組件可見的方式。 在使用組件時，您可以傳遞一個變量而不是一個值，以動態更改它： <script> import SignupForm from './SignupForm.svelte'; let disabled = true </script> <SignupForm disabled={disabled}/> 當disabled變量值變化時，子組件將以新的prop值進行更新。例如： <script> import SignupForm from './SignupForm.svelte'; let disabled = true setTimeout(() => { disabled = false }, 2000) </script> <SignupForm disabled={disabled}/>