- 博客(16)
- 收藏
- 关注
RSS订阅原创 选项式API
选项式API是一-种通过包含多个选项的对象来描述组件逻辑的API,其常用的选项包括data、methods、computed、watch等。在组件的初始化阶段，Vue 内部会处理这此选项，把选项中定义的数据、方法、计算属性、侦听器等内容添加到组件实例上。如果使用组合式API，可以将项目的每个功能的数据、方法放到一起，这样不管项目的大小，都可以快速定位到功能区域的相关代码，便于阅读和维护。Vue提供的选项式API和组合式API这两种写法可以覆盖大部分的应用场景，它们是同一底层系统所提供的两套不同的接口。
2024-06-23 21:54:38
181
原创 结合过渡与动画效果
Vue.js提供了过渡和动画的支持，使得我们可以在应用中创建流畅的视觉效果。结合$nextTick方法，我们可以更好地控制过渡和动画的时机，让它们在更新之后生效，从而达到更好的用户体验。
2024-06-16 18:56:26
729
原创 Button组件
Ant Design Vue Ant Design Vue组件库提供了大量图标按钮和各种按钮样式，包括按钮的类型、按钮的形状、按钮的大小、按钮的加载状态和禁用状态等。Botton组件使用<a-button>标签定义，在<a-button>标签中可以通过type、disabled、loading等属性定义按钮的样式。<a-button>标签的常用属性如表6-10所示。
2024-06-11 10:14:08
353
原创 Axios
axios是一种网络请求库，用于发送和接收请求。它可以通过promise机制来处理请求，使用jsonp的方式获取数据，也可以使用默认的get请求的参数拼接。axios还可以发送并发请求，使用全局请求配置格式和timeout来控制请求的执行。在封装网络请求时，可以使用promise包装、回调函数的方法或拦截器来处理请求。
2024-06-02 18:46:25
127
原创 vue 组件组件通信方法
子组件中定义props字段，类型为Array（如需限制字段值类型，也可以定义为Object的形式）。如下例子，父组件挂载子组件helloWorld，在组件标签上给title赋值，子组件helloWorld定义了props属性，里面有一个值是title，这样子组件就可以使用父组件传递过来的值了。子组件：hello-world.vue。1、父组件props传值给子组件。2.）props扩展示例。
2024-05-26 21:49:30
176
原创 vuex计数器案例
在上述代码中，第3行代码使用<button>标签定义“+”按钮；第4行代码设置“+”按钮后的数字的初始值为0；第7行代码使用<button>标签定义“-”按钮；第8行代码置“-”按钮后的数字的初始值为100。需要注意的是，为了展示页面效果，这里的初始值先设置为静态值，后期会修改为动态值。在计数器页面中单击“+”按钮，其后数字从0变为1，效果如图7-6所示。在计数器页面中单击“-”按钮，其后数字从100变为99，效果如图7-7所示。10清空src\App.vue文件中的内容，重新编写如下代码。
2024-05-19 19:21:07
207
原创 列表渲染指令
为此，Vue提供了列表渲染指令 v-for，只需要在模版中定义一件商品结构，v-for就可以根据提供的数据自动渲染商品列表中所有商品。<标签名 v-for="(item,name,index) in obj "><标签名><标签名 v-for="(item,index) in arr "><标签名><标签名 v-for="(item,index) in num "><标签名><标签名 v-for="(item,index) in str "><标签名>1.使用v-for根据数组渲染列表。
2024-05-05 19:04:51
216
原创 table组件
Table 组件使用<el-table>标签定义，在该标签中绑定 data对象数组后，在el-table-column>中使用prop属性对应对象中的键名，即可将数据添加到表格中；使用label属性可以定义表格的列名，使用width属性可以定义表格的宽度。Flement Plus组件库提供了Table组件，用于展示多条结构类似的数据，例如工资表涯程表和计划表等，可以对数据进行排序、筛选、对比或其他自定义操作。tableData数组对象。2在上述代码中，第2行代码绑定data数组对象 tableData；
2024-04-28 15:44:23
493
原创 vue小结（1）
/ this.$nextTick与setTimeout区别。// this.$nextTick 用于调取接口，类似于延时器。// keep-alive用于缓存组件，优化性能。// this.$nextTick先执行。
2024-04-14 18:41:03
173
1
原创 vue一周总结
/ 3.注册时可以取别名，别名不可以驼峰命名，需要使用-连接，不能使用已有的标签作为名称。// 5.未搭建脚手架使用单标签会使后面代码都不渲染。// 4.模板时只能有一个父级，只在vue2中。// 2.data必须使用函数写法。// 1.定义组件中不要绑定el。// 使用自定义组件规则。创建school组件。
2024-03-31 18:39:22
157
1
原创 computed与watch
5.watch默认监听一层，需要监听多级如对象中的值，需要添加深度监听deep:true。4.写法：第一种Vue实例中，第二种实例化vm.$watch("监听的属性",{})2.被Vue实例管理的函数最好都使用普通函数，不被Vue实例管理的函数最好都使用箭头函数，3.handler(新值,旧值)函数，当监听值发生改变时就会触发handler函数。1.computed能做到的watch都可以，watch能做到的computed不一定能。写法：监听的属性名(新值,旧值){}computed与watch。
2024-03-24 20:37:45
107
1
原创 v-cloak
v-cloak 是一个实用的 Vue 指令，它可以在页面加载期间防止用户看到未编译的 Vue 代码。当使用 v-cloak 时，通常会结合 CSS 规则来确保在 Vue 编译过程完成之前，用户看不到任何预编译的内容。这包括防止大括号 {{ }} 和其他模板语法在页面上闪烁。v-cloak 指令用于隐藏未编译的内容，直到 Vue 实例编译完成。什么是v-cloak。
2024-03-09 21:18:01
133
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人