vue
distantimg
这个作者很懒,什么都没留下…
展开
-
1.vue 自动新建项目文件plop-templates组件使用
vue自动生成模块的小组件原创 2022-04-22 12:09:14 · 1485 阅读 · 0 评论 -
vue reader函数介绍
reader函数原创 2022-04-19 15:07:03 · 610 阅读 · 0 评论 -
一边文章搞定Vuex
1.State提供唯一的公共数据State提供唯一的公共数据源,所有共享的数据都要统一放到Vuex.store中的State中存储1.第一种方法//在组件中<h3>当前最新的count值为:{{$store.state.count}}</h3>//vue中this.$store.state.全局数据名称 如:this.$store.state.count2.第二种方法//1..先按需导入mapState函数: import { mapState } from 'v原创 2020-11-30 20:37:41 · 200 阅读 · 1 评论 -
lodash深拷贝浅拷贝
1. lodash深拷贝深拷贝是把对象重新开辟一个内存地址拷贝过来例子,v1浅拷贝出v11,修改v11不会修改到v1对象转json,json转对象,深拷贝stringify()将对象转json字符串,parse()将json转js对象npm i lodash 安装依赖import _ from 'lodash' 导入依赖const v11= _.cloneDeep(v1) 使用深拷贝2. lodash浅拷贝lodash浅拷贝是新建一个指针指向原内存地址例子,v1浅拷贝出v11,修改v1原创 2020-11-30 01:27:24 · 6593 阅读 · 3 评论 -
学习lodash,一篇文章就够了
安装npm i lodash -D然后在使用的vue组件里边<script> import _ from ‘lodash' export default{} </script>一、Array的一些常用方法的总结:_.compact(array)compact的中文意思是“紧凑的”去假,例如false, null, 0, “”, undefined_.compact([0, 1, false, 2, '', 3]);// => [1, 2,原创 2020-11-30 01:18:32 · 333 阅读 · 0 评论 -
.prettierrc 格式化工具配置文件
{ "semi":false, "singleQuote":true}原创 2020-11-30 00:53:10 · 404 阅读 · 2 评论 -
Vue配置生产环境使用的插件
配置babel.config.js 文件const prodPlugins=[]//生产环境添加插件if(Process.env.NODE_ENV==='production'){ prodPlugins.push('transform-remove-console')}module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ [ 'component',原创 2020-11-27 21:04:41 · 391 阅读 · 3 评论 -
vue常用的开发依赖
vue-routerVue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。axios用于发起Ajax请求,设置拦截请求和响应等学习文章:axios的基本使用基于 Quill、适用于 Vue 的富文本编辑器,支持服务端渲染和单页应用babel-plugin-syntax-dynamic-import路由懒加载时用到的组件,把不同路由对应的组件分割成不同代码块,然后当路由被访问时才加载对应组件文档:路由懒加载lessLes原创 2020-11-27 14:04:10 · 782 阅读 · 0 评论 -
async/await 的基本用法
async/await是ES7引入的新语法,可以更加方便的进行异步操作async 关键字用于函数上(async函数的返回值是Promise实例对象)await 关键字用于 async 函数当中(await可以得到异步的结果)async function queryData(id) { const ret = await axios.get('/data'); return ret; } queryData.then(ret=>{ console.log(ret)原创 2020-11-22 13:56:23 · 120 阅读 · 2 评论 -
axios的理解使用
axios官网支持浏览器和 node.js支持 promise能拦截请求和响应自动转换 JSON 数据1. axios基本用法 axios.get(‘/adata') .then(ret=>{ // data属性名称是固定的,用于获取后台响应的数据 console.log(ret.data) })2.get : 查询数据通过url传递参数 axios.get(‘/adata?id=123') .t原创 2020-11-22 13:52:32 · 462 阅读 · 8 评论 -
Vue-传值
1.父传子 props声明<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="app"> <div>{{pmsg}}</div> <menu-item :pstr='pstr原创 2020-11-21 21:28:31 · 64 阅读 · 0 评论 -
vue全局组件和局部组件
1.全局组件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div id="原创 2020-11-21 20:46:26 · 111 阅读 · 0 评论 -
vue生命周期
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="app"> <div>{{msg}}</div> <button @click='update'>更新</b原创 2020-11-21 20:05:05 · 60 阅读 · 0 评论 -
Vue监听过滤
1. 监听`input<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div原创 2020-11-21 19:52:19 · 114 阅读 · 0 评论 -
vue常用的指令
1.v-cloak防止页面加载时出现闪烁问题<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> [v-cloak]{ display: none; } </style></head><bo原创 2020-11-21 15:57:45 · 202 阅读 · 2 评论 -
vue-自定义指令
1.Vue.directive 注册全局指令Vue.directive('focus', { // 当绑定元素插入到 DOM 中。 其中 el为dom元素 inserted: function (el) { // 聚焦元素 el.focus(); } }); new Vue({ el:'#app' });2.Vue.directive 注册全局指令 带参数Vue.directive('color', { // bind声明周期, 只调用一次,指令第一次绑定到元素时调原创 2020-11-20 16:27:46 · 59 阅读 · 0 评论 -
vue表单常用特性
1.表单基本操作获取单选框中的值通过v-mode<input type="radio" id="male" value="1" v-model='gender'> <label for="male">男</label> <input type="radio" id="female" value="2" v-model='gender'> <label for="female">女</label> <script>原创 2020-11-20 15:05:54 · 110 阅读 · 0 评论