- 博客(17)
- 收藏
- 关注
RSS订阅原创 vue3中watch、computed使用
watch([被监听的数据1,被监听的数2,...],([val1,val2,...],[oldVal1,oldVal2,...])=> {console.log(val,oldVal) // 新值和老值。console.log(val,oldVal) // 新值和老值。watch(被监听的数据,(val,oldVal)=> {watch(被监听的数据,(val,oldVal)=> {val1,val2,.... 新值。const 自定义名字=computed(()=> {// 执行计算表达式。
2024-02-20 16:07:34
354
原创 vue中pinia的使用
可以用来请求数据 也可以用来修改数据 等价于vuex中actions和mutations的合体。在getters和actions中获取state中数据 需要使用this.state中属性名。import {自定义常量名} from './store/文件名.js'{{store.getters方法名}}store.actions方法名(实参){{store.state属性名}}store.actions方法名()自定义方法名(形参) {获取一个新的数据集合。自定义方法名() {自定义方法名() {
2024-02-20 16:04:37
377
原创 a标签超链接跳转到新页面
即点击链接时 不在原有页面跳转 ，而是重新打开一个页面实现跳转。很多在写官网的时候领导都会让跳转到一个新页面，以上只是其中方法之一，比较简单。
2024-02-19 10:26:49
664
1
原创 vue2路由
vue是单页面应用 实现路由组件到路由组件之间的跳转 用来模拟页面到页面之间的跳转。<router-link to="自定义路径">内容</router-link>区分普通与路由依据是：是否在routes配置组件 配置的组件就是路由组件。5 在普通组件模板中 写上 router-link和router-view。两者的区别在于：普通组件需要注册 路由组件不需要注册可以直接使用。component: 自定义组件名。3 创建router 配置routes。const 自定义组件名={2 配置routes。
2024-01-31 18:18:33
191
原创 关于具名插槽和作用域插槽
</slot>1 在子组件模板的slot标签上边 绑定需要发送的子组件数据。<slot :自定义属性名="要发送的数据">
2024-01-31 18:12:25
273
原创 使用solt进行组件的封装
el-button type="danger" round>危险按钮</el-button><el-button type="info" round>信息按钮</el-button><el-button type="primary">主要按钮</el-button><el-button type="success">成功按钮</el-button><el-button type="warning">警告按钮</el-button>slot是官方直接封装好的组件 可以直接使用而不需要注册。
2024-01-31 18:10:11
227
原创 computed watch filter
immediate: true // 组件加载完成立即先执行一遍 handler里边的代码。console.log(val, oldval) // data的新值和老值。当data改变的时候 再次执行handler里边的代码。当函数表达式比较长的时候或者比较复杂时候 我们可以使用computed计算属性。2 在{{}}中使用 | 自定义方法名来格式化数据。data: 'methods中的方法名'只有当监听的数据改变的时候，里边的函数才能触发。{{data数据 | 自定义方法名}}自定义方法名() {
2024-01-24 18:02:56
357
1
原创 JS相关属性和方法
该方法中可以包含两种参数，一种参数是要访问的URL在历史列表中的相对位置；(".example") 方法返回文档中匹配指定 CSS 选择器的所有元素，返回 NodeList 对象。如果没有找到任何匹配的子串，则返回 -1。返回子字符串abc在字符串中最后一次出现的位置（从0开始计算），不存在返回-1。返回子字符串abc在字符串中第一次出现的位置（从0开始计算），不存在返回-1。("#demo") 方法返回文档中匹配指定 CSS 选择器的一个元素。向当前节点添加子节点，子节点被添加在子节点列表的尾部。
2024-01-19 17:07:32
325
1
原创 vue2生命周期钩子函数
destroyed和beforDestroy一般用于组件的销毁 一般用于定时器的销毁。后期写项目我们可能使用最多的是created或者mounted。updated和beforUpdate只会在数据改变的时候触发。每个组件内部的生命周期是有先后顺序的 跟编写的先后顺序没有任何的关系。created和mounted一般用于数据的动态请求及赋值。我们可以使用 $destroy()方法或者使用v-if。beforeCreate不能获取到data数据。每一个组件都有属于自己的完整的生命周期。销毁 destroy。
2024-01-19 17:04:36
469
1
原创 props进阶
default: 默认值 // 当你的组件没有传值的时候 会显示默认值。type: [数据类型1,数据类型2,...],自定义名字: [数据类型1,数据类型2,...]return 代码块。type: 数据类型,type: 数据类型,自定义名字: 数据类型,对传入的数据进行二次检验。验证validator。
2024-01-19 17:02:05
345
1
原创 vue组件传值
2 在父组件中找到子组件标签 然后在子组件标签上 使用v-bind:自定义名字="父组件要发送的数据"2 在父组件中 找到子组件标签 在子组件标签上 使用v-on:自定义事件名1="新的方法名"<子组件标签 v-on:自定义事件名1="新的方法名"></子组件标签>this.$emit("自定义事件名1",要发送的数据)2 在需要发送数据的组件中 使用bus.$emit("自定义名字",要传递数据)<子组件标签 :自定义名字="要发送的数据"></子组件标签><元素标签>{{自定义名字}}</元素标签>
2024-01-19 17:01:17
357
1
原创 vue中使用组件封装计时器
button @click="add">点击了{{num}}次</button>// 组件 根组件。这个只是在html里面写的。
2024-01-19 16:51:59
397
1
原创 vue组件介绍
自定义组件标签名></自定义组件标签名> // 它所渲染的就是template里边所写的模板。如果自定义的组件标签名 含有多个单词组成(一般建议使用中横线命名或者使用大驼峰或者小驼峰)在html页面中调用时候 需要统一将小驼峰或者大驼峰转化为中横线调用。Vue.component("自定义组件标签名", {组件是由html css js构建起来一个元素 组件一旦被构建就不能在改变。组件标签名 不能与已有的html标签名冲突。
2024-01-10 15:43:49
327
原创 vue指令
元素标签 v-for="(自定义名字, 自定义下标索引) in data数据" v-bind:key="自定义下标索引"></元素标签>(从 2.1.0 开始支持)v-for与v-if尽量不要写在一个标签上边，因为如果两个指令写在一起 我们在vue2.x v-for优先级大于v-if。<元素标签 v-else-if="条件2"></元素标签><元素标签 v-else-if="条件3"></元素标签>v-else-if也不能单独使用 前边必须有v-if或者v-else-if。
2024-01-10 15:38:14
1025
原创 vue介绍
Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。Vue是一个单页面(spa)的应用。2 使用脚手架进行自动化构建 (vue-cli或者vite)<元素标签>{{data中变量名}}</元素标签>名字：mustache插值语法。双花括号中是一个js运行环境。
2024-01-10 15:11:46
301
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人