(一)SvelteKit教程:hello world
sveltekit 的官方教程,在这里:Creating a project • Docs • SvelteKitCreating a project • Docs • SvelteKit
我们可以按照如下的步骤来创建一个项目:
npm create svelte@latest my-app
cd my-app
npm install
npm run dev
之后你就可以通过访问:http://localhost:5173/ 来看到原始画面了。
这个 SvelteKit 代码主要做以下事情:
- 初始化一个变量
name
并将其值设置为'hello ming'
。 - 定义一个函数
handleClick
,该函数在调用时将name
的值修改为'hello world'
。 - 在页面中显示一个标题,标题内容包括
name
的当前值。 - 显示一段包含超链接的文本,指向 SvelteKit 的文档。
- 显示一个按钮,点击按钮时调用
handleClick
函数。 - 显示一个输入框,输入框的值绑定到
name
变量,允许用户直接修改name
的值。
逐行解释如下:
<script>
// 定义一个变量 name,并初始化为字符串 'hello ming'
let name = 'hello ming';