-
svelte中组件的script块和props
<script>块一个组件中<script>块包含创建组件实例时运行的JavaScript在顶层声明(或导入)的变量在该组件中默认是处于“可见”的,可以直接使用<script> let num = 0; function but(){ num++; } </script> <button on:click="{ but }">当前num值:{ num }</button>组件的PropsProps表示子组件从父组件接受到的数据,要完成组件间的数据传递,需要...
2023-08-28 -
svelte中的组件
组件是可以重用的,将一个或多个组件组合而成就获得了一个Svelte应用本质上就是一个后缀为.svelte的文件,该文件包含了HTML(<main>标签,可省略)、CSS(<style>标签) 和 JavaScript(<script>标签) 代码组件有数据隔离的作用,在一个组件中的js代码或者css代码只会影响该组件中的内容而不会影响其他组件如在一个组件中的css中使用了p{color:red},如论组件怎么组合,也不会影响到其他组件中的p元素在一个.svelte文件中,顶层标签中仅允许一个<script>和一个<style>标...
2023-08-28 -
Svelte简介及项目创建
什么是SvelteSvelte用于构建快速的Web应用,类似 React 和 Vue,都致力轻而易举地构建灵活的可交互的用户界面与React 和 Vue不同的是:Svelte在构建时将代码转为更优的JavaScript,而不是在运行时才解释执行代码Svelte更像一个Javascript编译器,将代码编译成经过优化的原生Javascript代码这预示着无需付出框架本身的性能成本,且首次加载也无额外性能损耗由于Svelte的功能类似于一个编译器,就意味着不可能像其他框架那样在HTML中直接使用script标签引用来使用,必须创建对应的项目,编写完成后经过Svelte编译成优化后的原生Jav...
2023-08-08 -
vue中的生命周期函数
每个Vue组件实例在创建时都需要经历一系列的初始化步骤,如设置好数据侦听,编译模板,挂载实例到DOM,以及在数据改变时更新DOM等等在此过程中会运行被称为生命周期钩子的函数,让开发者有机会在特定阶段运行自己的代码生命周期函数统一使用驼峰式命名规则,即首单词小写,后面每个单词的首字母大写选项式API中生命周期函数名称没有on,组合式API在生命周期函数前面加上on,如:mounted(){} 和 onMounted(){} beforeUpdate(){} 和 onBeforeUpdate(){} 一个组件按照时间顺序依次经历的生命周期:beforeCreate():在实例初始化完成、pr...
2023-08-01 -
layui的基础方法和属性
Layui是一套开源免费的Web UI组件库,采用自身轻量级模块化规范,遵循原生态的 HTML/CSS/JavaScript 开发模式,极易上手,拿来即用Layui区别于一众主流的前端框架,更多是面向于追求简单的务实主义者,即无需涉足各类构建工具,只需面向浏览器本身,便可实现页面所需呈现的元素与交互layui官方文档网址:https://layui.dev/layui官方开源网址:https://github.com/layui/layuilayui的引入<link rel="stylesheet" href="https://unpkg.com/la...
2023-05-10