- 博客(9)
- 收藏
- 关注
原创 grid网格布局的一些方法和属性
最近发现了一种比较好用的css布局grid网格布局,下面就是使用的方法以及一些属性display:grid;开启网格布局 grid-template-columns:100px 100px; 属性定义网格布局中的列数,并可定义每列的宽度。可以使用 1fr 这是 grid 独有的 grid-template-columns: repeat(2,1fr) 第一个参数重复的次数 第二个参数宽 grid-template-rows 属性定义每列的高 度。 grid-column-gap
2021-06-28 20:47:52
264
原创 vue3的vuex使用的步骤
在vue3中使用vue2中的写法也可以 但是这里我们使用组合api来使用vuex的数据和各种方法打开store中的index.js 代码如下// 可以看出与vue2的写法有些区别,但是用法一样// 但是需要注意的是如果在创建项目时没有安装vuex 则需要自己安装 安装命令是 npm install vuex@next --save 这里需要注意命令的不同 安装的版本就不同import { createStore } from 'vuex'export default createStore({
2021-06-28 20:40:11
860
原创 vue3的命令打包问题
有些情况下我们需要定义全局方法 然而在vue3.0中我们定义全局方法需要在globalProperties上面定义大部分情况下还是可以定义在main.js中的 我们这里就以定义在main.js中为例// 这里我们就简单的随便添加一个属性 import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' let app = cre
2021-06-28 20:33:13
362
原创 vue3中的model的改动
本来想着在vue3.X版本的项目中封装一个input组件,由于2.0中封装的收到擒来也就没有仔细去看文档最后导致效果怎么也实现不了,这就是不仔细看文档的代价吧,这里来说一下这个问题在vue3.0版本中对v-model的改动个人认为还是挺大的 这里就以封装一个input组件为例第一步在components文件夹中 创建一个myInput.vue文件代码如下 <template> <div> <input type="text" :value="mo
2021-06-04 15:09:00
410
原创 vue3使用vant组件库所用到的降级命令
创建项目vue create yxsc_project安装vant 组件库第一步安装命令 npm install vant@next --save (因为使用的是vue3.x 所以要安装vant的针对vue3的版本 vant@next)第二部vant的进阶使用 通过 npm install postcss postcss-pxtorem --save-dev (用来将px尺寸转化为rem尺寸)配置rem的根元素字体大小 安装lib-flexiable 安装命令 npm i amfe-flexi
2021-05-31 14:35:44
1044
原创 vue中的双向数据绑定
vue的双向数据绑定是通过劫持订阅者开发者来实现的,主要使用的是vuex里面的v-model,给属性添加上getter,和setter来监听数据变化,如果数据的getter发生改变的话,那么视图就会跟随着数据的改变而改变,或者就是视图发生改变,数据跟随着视图的改变而改变我们常见的双向数据绑定分为4步第一步:*就是对observer的数据进行递归遍历,给每一个属性都添加上getter和setter属性,用来监听数据的变化***第二步:***就是对compile进行解析,将compile模板...
2021-05-28 16:15:59
110
原创 react路由的嵌套传参
因为react的嵌套路由跟vue比就像屎一样 不好写 所以在使用的时候建议使用react-router-config来配置路由 会相对轻松第一步 先安装路由依赖yarn add react-router-dom --saveyarn add react-router-config --save12第二部 配置路由文件新建一个routes.js文件 新建pages文件夹和home组件about组件及page2组件 import React from 'react'; impor...
2021-05-28 15:55:39
173
1
原创 vue的命令打包
在开发过程中vue项目打包是需要做一些性能优化的,这里写了关于我知道的要做的优化的部分,废话不多说直接上代码了,仅供参考 欢迎提出意见const UglifyJsPlugin = require('uglifyjs-webpack-plugin')const path = require('path')// 开启Gzip需要的依赖 yarn add compression-webpack-plugin -Dconst CompressionWebpackPlugin = require('compr
2021-05-28 15:51:51
1083
原创 vue中的深浅拷贝
话不多说直接上代码了<script> var obj = { // 定义要进行深复制的对象 name: "张三", age: 14, tel: 110, info: { isSingle: true } } // 定义深复制的函数 function deepClone(param...
2021-05-28 15:46:17
395
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人