1.标签里用{属性字段}展示
<h1>Hello {name}!</h1>2.事件的添加
<button on:click={handleClick}>3.用$定义变量 或者表达式
let count = 0; $: doubled = count * 2;4. 因为Svelte的更新是由赋值触发的，所以数组的push不会改变DOM，数组操作后需要重新赋值。 对象也是一样
numbers.push(numbers.length + 1); numbers = numbers;5.判断语句可以写在html标签外，需要#
{#if user.loggedIn} <button on:click={toggle}> Log out </button> {/if} {#if !user.loggedIn} <button on:click={toggle}> Log in </button> {/if}6.循环数组或者对象中的数据也是用#，不过使用each i是作为第二个参数
{#each things as thing , i(thing.id)} <li><a target="_blank" href="https://www.youtube.com/watch?v={cat.id}"> {i + 1}: {thing} </a></li> {/each}7. 可以在标签里处理异步数据
{#await promise} <p>...waiting</p> {:then number} <p>The number is {number}</p> {:catch error} <p style="color: red">{error.message}</p> {/await}8.同样支持事件修改器例如on:click|once
9.表单绑定
<input bind:value={name}>今天的文章 svelte学习分享到此就结束了，感谢您的阅读。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/bian-cheng-ji-chu/82016.html