svelte-学习-待续

56 阅读1分钟

svelte 概述

Svelte 是一个可以使用原生html,但是又结合了模板语法,响应式等现代前端开发框架所必须的一切功能!

1.安装脚手架 npx sv create  
2.文件后缀名为.svelte
3.里面可以使用原生加模板字符串的写法
<script>
	let string = `this string contains some <strong>HTML!!!</strong>`;
</script>

<html lang>
	<body>
	   <p>{@html string}</p>
           // 这里 @html 类似于vue中的 v-html   {} 就是vue中变量使用 {{}}
	</body>
</html>


声明 响应式变量使用$state() 这个载体去声明

<script>
	let count = $state(0);

	function increment() {
		count += 1 ;
	}
</script>

<button onclick={increment}>
	Clicked {count}
	{count === 1 ? 'time' : 'times'}
</button>