vue
vue
前端小白呀
前端小白一枚,记录自己平时遇到的问题,大佬们不喜勿喷
展开
-
vue中父组件及子组件生命周期执行顺序笔记
vue中父组件及子组件生命周期执行顺序vue中父组件及子组件生命周期执行顺序如下:子组件更新过程父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated销毁过程父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed...原创 2020-07-17 15:14:19 · 418 阅读 · 0 评论 -
vue中父传子-子传父-非父子组件传值
vue中组件传值父传子:通过v-bind的形式传值,子组件通过props接收。子组件的h2标签中的{{hello}}在页面上的展示为world。**父组件:** <div class="home"> <HelloWorld :hello="hello"/> </div> data(){ return{ hello: 'world' } } hr br原创 2020-07-12 14:58:45 · 319 阅读 · 0 评论 -
vue生命周期函数
vue生命周期函数笔记 <div id="app"> <p @click="handleClick"> {{message}} </p> </div> 打印出生命钩子中的内容:总结:1.beforecreated:el 和 data 并未初始化2.created:完成了 data 数据的初始化,el没有3.beforeMount:完成了 el 和 data 初始化 ,此时的$el为虚拟的dom节点4.mounted :原创 2020-07-07 17:49:52 · 173 阅读 · 0 评论 -
vue中params与query区别
关于vue-router 中参数传递的那些坑(params,query)vue-router传递参数分为两大类:编程式的导航 router.push声明式的导航 query和params的区别,query相当于get请求,在页面跳转的时候,可以在地址栏看到请求参数,然而params则相当于post请求,参数不会在地址栏中显示。很多人都说query传参要用path来引入,params传参要用name来引入,确实是这样,不过只针对router-link方法,具体看代码<router-lin原创 2020-05-28 13:51:18 · 1098 阅读 · 0 评论 -
前端鼠标形状设置--cursor
前端鼠标形状设置–cursor前端鼠标形状设置,可以通过设置cursor属性来修改。在Vue项目中,改变鼠标形状设置:在index.html中写入下面的代码即可。body{ cursor: url('./favicon.ico'),default;}效果图如下:以下是cursor的一些基础属性,大家可以挨个试试。。。## 标题default 默认光标(通常是一个箭头)auto 默认。浏览器设置的光标。crosshair 光标呈现为十字线原创 2020-05-13 13:32:25 · 5076 阅读 · 3 评论 -
获取当前时间,并转换为时间戳
获取当前日期以及日期和时间戳的转换 <p>当前时间:{{getTimes}}</p> <p><button @click="handleClick">时间转换成时间戳:</button>{{timestamp}}</p> <p><button @click="changeTime">时间戳转...原创 2020-01-15 15:28:13 · 3059 阅读 · 0 评论 -
更改安装时的包管理器yarn或npm
更改安装时的包管理器yarn或npm在执行 vue create xxx 创建项目时,执行运行命令时,如果是npm run serve则表明你使用的是npm创建的项目;如果是yarn serve则表明你使用的是yarn创建的项目。那么如何切换包管理器呢???在Vue CLI中详细介绍了只需要找到这个文件,手动修改packageManager:npm或yarn(根据自己的需求)即可。...原创 2020-01-15 14:39:48 · 740 阅读 · 0 评论 -
vue创建项目时上下箭头不可用
vue创建项目时上下箭头不可用使用vue-cli创建项目时,发现上下箭头不可用。default 是使用默认配置,Manually select features 是自定义配置,但是上下的箭头不可用,这时候将***vue create 项目名***这个指令改为 winpty vue.cmd create 项目名 即可。如图:...原创 2020-01-14 13:22:29 · 1333 阅读 · 0 评论 -
vue中input的全选与取消全选
vue中input的全选与取消全选html: <p>全选:<input type="checkbox" @click="selectAll()" v-model="checked" /></p> <div v-for="item in checks" :key="item.id"> <input type="checkbox" ...原创 2020-01-10 14:29:45 · 2332 阅读 · 2 评论