前端小白呀-CSDN博客

原创 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 1070

原创小程序动态添加class样式

小程序动态添加class样式<view class="bookChoice" wx:for="{{typeList}}" wx:key="index" data-item="{{item}}" bindtap="changeType"> <text class="bookText {{item == type? 'activeColor': ''}}" data-type="{{item}

2020-08-05 10:28:49 579

原创 vue中父组件及子组件生命周期执行顺序笔记

vue中父组件及子组件生命周期执行顺序vue中父组件及子组件生命周期执行顺序如下：子组件更新过程父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated销毁过程父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed...

2020-07-17 15:14:19 405

原创 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 298

原创 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 158

原创微信小程序--修改switch组件的大小size

修改switch组件的大小小程序中switch组件的大小往往和实际项目中的大小有些出入，但是发现文档中并没有修改大小的方法，但是可以根据自己的实际情况进行颜色设置。直接上代码：<switch checked>正常开关</switch><switch checked style="transform:scale(0.7)" color="red">开关</switch><switch checked style="zoom:0.6" color=

2020-07-01 13:20:37 1614

原创微信小程序--设置radio组件大小颜色

radio组件大小小程序中radio组件的大小往往和实际项目中的大小有些出入，但是发现文档中并没有修改大小的方法，但是可以根据自己的实际情况进行颜色设置。直接上代码：<radio color="red">颜色</radio><radio color="red" style="transform:scale(0.6)">大小</radio>效果如下：...

2020-07-01 11:48:57 3571

原创 Js中的this指向问题

普通函数和箭头函数的this指向普通函数 var number = 50; var obj = { number: 2, getNum: function(){ var number = 6; return this.number; } } console.log(obj.getNum()); //2 console.log(obj.getNum.call()) //50 console.log(obj.getNum.call({number:7})) //7

2020-06-01 16:38:30 245

原创前端鼠标形状设置--cursor

前端鼠标形状设置–cursor前端鼠标形状设置，可以通过设置cursor属性来修改。在Vue项目中，改变鼠标形状设置：在index.html中写入下面的代码即可。body{ cursor: url('./favicon.ico'),default;}效果图如下：以下是cursor的一些基础属性，大家可以挨个试试。。。## 标题default 默认光标（通常是一个箭头）auto 默认。浏览器设置的光标。crosshair 光标呈现为十字线

2020-05-13 13:32:25 4549 3

原创获取当前时间，并转换为时间戳

获取当前日期以及日期和时间戳的转换 <p>当前时间:{{getTimes}}</p> <p><button @click="handleClick">时间转换成时间戳:</button>{{timestamp}}</p> <p><button @click="changeTime">时间戳转...

2020-01-15 15:28:13 3003

原创更改安装时的包管理器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 691

原创 vue创建项目时上下箭头不可用

vue创建项目时上下箭头不可用使用vue-cli创建项目时，发现上下箭头不可用。default 是使用默认配置，Manually select features 是自定义配置，但是上下的箭头不可用，这时候将***vue create 项目名***这个指令改为 winpty vue.cmd create 项目名即可。如图：...

2020-01-14 13:22:29 1288

原创 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 2242 2

原创复选框的选中和取消

复选框的选中和取消选中复选框，传递当前复选框的id，将其存在数组。取消复选框，将当前id从数组哩取出来。html： <div v-for="item in checks" :key="item.id"> <input type="checkbox" :value="item.id" @click="handleClick(item.id)" v-model="ch...

2020-01-09 17:22:35 979

ZHHhao的博客