1 前言
props 很快就会安排,但现在得先知道 Svelte 怎样设置状态(state),它会像 React 一样需要 setState 才能更新吗?还是说像 Vue 里面响应式自动监听变动?
2 写一个带 state 的组件
明眼人都看得出来,响应式变量更方便,不用 setState,Svelte 中 state 的用法跟 Vue 很像,但实际上,跟它最像的是原生页面写法,就是在写一个 .html 文件的时候,里面的 script 内容是全局的,不需要 this,直接用即可。下面是用 Svelte 写的一个动态刷新当前时间的组件。
App.svelte
<script>
let time = "";
setInterval(() => {
time = new Date().toLocaleString();
}, 1000);
</script>
<h3>Now: {time}</h3>
3 总结
有状态组件中 state 行为与 Vue 类似,模板中使用单大括号包裹,没有 this。