2020年09月_笑道三千

原创 Vuex的官方文档笔记

一，它是什么？（三句话）1，Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。针对这一点，因为vue开发的大多是具备许多组件构成的项目，所以在vue项目中，vuex有大量使用的场景需求。2，它采用集中式存储管理应用的所有组件的状态传统的组件间传值，需要具备父子关系，利用属性绑定父传子，事件绑定子传父，利用事件Bus传递兄弟组件间的数据。当组件一多，业务逻辑一复杂，就会显得非常呆板混乱：在没有使用vuex的时候，两个不相干组件间的数据传递会牵扯到整个链条上的所有组件，非常麻烦。而引

2020-09-30 11:06:53 348

原创 Vuex的基础知识

一，Vuex的概述之前学习的组件间传值：然而在实际开发过程中，组件间的传值远远比这些复杂，所以又引入了Vuex。二，Vuex的基本使用三，使用vuex的计数器小案例地初始化<template> <div > <my-addition></my-addition> </hr> <my-subtraction></my-subtraction> </div>&

2020-09-30 00:10:14 154

原创 vue组件化的基本使用

一，创建好各个组件二，在根组件中使用：<template> <div > <my-addition></my-addition> </hr> <my-subtraction></my-subtraction> </div></template><script> //导入两个组件 import Addition from './components

2020-09-29 22:26:16 174

原创 vue的零碎知识点-黑马后台项目整理

一，Vue.$nextTick方法的作用$nextTick方法的作用.当页面上的元素被重新渲染之后,才执行这里面回调函数的代码具体案例： //tag标签的事件显示input showInput(val) { val.inputVisible = true; //$nextTick方法的作用.当页面上的元素被重新渲染之后,才执行这里面回调函数的代码 //在这里,是变成input函数之后,再获取焦点 this.$nextTick(_ => { //文本

2020-09-29 19:54:16 322

原创黑马vue实战项目-（八）项目的上线

一，将项目打包好会在文件夹生成dist文件夹，这个文件夹就是项目的打包文件二，使用express创建web服务器1，npm init -y初始化项目环境，生成pakage.json的项目信息文件2，npm i express -S3,将打包完毕的dist目录放到这里4，创建app.js创建成功后npm 运行，就可以用http://127.0.0.1:8080的域名访问了...

2020-09-29 19:53:05 950 3

原创黑马vue实战项目-（七）订单管理页面的开发

一，在git中新建分支，然后创建新的组件，完成基本的页面布局本来想和之前一样，写每一步的操作的，但是，这个页面用到的都是旧知识，我直接写好了……<template> <div>  <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '/welcome' }">首页<

2020-09-29 09:30:58 3235 13

原创黑马vue实战项目-（六）商品列表组件的开发

一，创建新的git分支和组件，完成基本的页面结构布局二，发起请求获取商品列表数据对应的接口文档如下：

2020-09-28 21:25:55 1633

原创黑马vue实战项目-（五）参数列表组件的开发

一，创建组件，配置路由，实现基本布局：<template> <div>  <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '/welcome' }">首页</el-breadcrumb-item> <el-breadcrumb-item>商品

2020-09-27 12:20:38 700

原创黑马vue实战项目-（四）商品分类页面的开发

一，布局商品分类组件和页面就是使用之前的代码修改一下，效果如下：二，获取商品分类数据列表在应该在页面的组件创建时就获取到，因为获取到的数据需要用来渲染页面的。所以需要利用vue的生命周期函数：<script> export default{ data(){ return{ //查询条件 queryInfo:{ type:3, pagenum:1, pagesize:5 }, // 查询到的商品分类 c

2020-09-25 21:33:31 2439

原创黑马vue实战项目-（三）权限管理功能开发

一，创建权限管理的新分支并推送到码云二，建立权限管理组件，并配置路由对应的路由：三，绘制基本布局面包屑导航和card区域，之前就做过了，复制过来直接用就行：  <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item :to="{ path: '/welcome' }">首页</el-breadcrumb-item&gt

2020-09-24 18:06:24 1659 2

原创黑马vue实战项目-（二）用户列表开发

一，主页布局其实就是使用element-ui进行布局而已：<template> <el-container class="home_container">  <el-header> <div> <img src="../assets/heima.png" alt=""> <span>电商后台管理系统</span> </div&gt

2020-09-23 17:14:19 1033

原创黑马vue实战项目-（一）项目初始化登录功能开发

一，项目初始化手动配置：选择babel,router,linter,使用配置文件：创建完成后预览下：二，配置element-ui组件库做一下相关配置：按需导入和中文。安装less-loader：安装less:三，配置axios四，在码云上初始化项目第一步：新建仓库：第二步：将初始化的项目提交到远程仓库git remote add origin https://gitee.com/ling-xu/my_shop2.gitgit push -u origin ma

2020-09-22 09:45:06 2458 4

原创对作用域插槽的理解：slot-scope

一，先来看看普通的组件<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/base.css"/> <style type="text/css"> #app{ width: 20%; marg

2020-09-20 23:49:15 1279

原创关闭eslink：报错：Unexpected tab character no-tabs

这是因为eslink的代码规范检验太严格了，不允许用tab代替空格：我原本这样写：<template> <div id="app"> App 根组件 </div></template>就报错了，改成这样就不会报错：<template> <div id="app">App 根组件 </div></template>既然已经知道是eslink代码检验的问题，那就要把它关闭掉

2020-09-08 12:26:20 2917

原创 vue-cli3的命令行创建项目-（慕课网笔记）

教程网址：https://www.imooc.com/video/20126第一步：创建一个新的文件夹，并进入：第二步：创建新项目vue create test3这里选择手动配置项目：（用上下箭头，选中后回车）接着采用空格和方向键来选择，完毕后后回车：选择第三版本：输入Y，回车：然后这个配置的文件，肯定还是选择package.json:然后问是否开始创建，回答y：接下来选择默认就行：就开始根据我们刚刚的配置进行项目的创建了：这样就创建完成了，按照提示，进入test3

2020-09-06 13:37:08 515

原创 github开源的流程-慕课网教程学习笔记

慕课教程视频网址：https://www.imooc.com/video/17302技术栈：已经安装npm和nodewebpack的基础了解 html javascipt css 和 nodejs 基础知识。了解 git 常用操作。第一章：什么是开源开源并不是仅仅贡献一份实现某种功能的代码，而是还是要包含以下东西：第二章：做什么？很多开源项目的产生是由于日常工作生活中有某个需求了，但是并没有对应的开源项目，于是就开始做出来，并把它开源了。想要做开源项目，你就得有一个预先的期望，然后

2020-09-05 19:23:04 3058

原创 npm publish发布包时出现403错误no_perms Private mode enable, only admin can publish this module:

出现原因：使用的是淘宝源cnpm,登陆到的是cnpm解决方法：切换到npmjs的网址，代码如下npm config set registry http://registry.npmjs.org/切换好之后，重新登陆使用就可以了：完结！撒花花！！

2020-09-05 16:13:38 621

原创安装gitbook的一些问题gitbook init和if (cb) cb.apply(this, arguments)，cb.apply is not a function

一，使用gitbook init时，卡在了Installing GitBook 3.2.3这一步解决办法：一，翻墙二，使用淘宝镜像下载：npm下载路径，检查是不是淘宝镜像：npm config get registry```csharp npm config set registry https://registry.npm.taobao.org切换成淘宝镜像再检查是不是淘宝镜像：npm config get registry再安装：gitbook init之前是一直卡在这

2020-09-05 02:36:11 9163 11

原创 webpack配置时：Plugin/Preset files are not allowed to export objects, only functions.

这是因为：babel的版本冲突导致的，比如说我的：一个是6，另一个是8，因为babel之前做过一个版本更新，8以上的babel-loader适配7以上的babel-core，否则冲突。解决办法有两个：第一种就是全部升级到新版本另一个办法是降级：我用的是降级：先卸载babel-loader，使用npm un命令。mpm un babel-loader然后安装7版本的：npm i babel-loader@7 -D这样处理之后，package.json里面的内容是这样的：这样，就

2020-09-04 17:54:53 3961 2

原创 Element-UI学习笔记-安装

是一个别人做好的样式的组件库。可以为程序员小朋友们省去美化样式的时间，从而把更多的时间精力放在自己的业务逻辑上。它的官方网址那么如何使用element-ui呢？有以下两种方法：一，基于命令行的方式手动安装第一步：安装依赖包npm i element-ui -s第二步：在打包入口文件main.js中导入element-ui相关资源//手动配置element-uiimport ElementUI from 'element-ui'import 'element-ui/lib/theme-ch

2020-09-04 12:36:00 244

原创 vue脚手架的自定义配置

当我们用脚手架创建出一个vue项目之后，它已经帮我们预先帮我们把一些基本的配置项搞定了。但是我们程序员可能要进行一些自定制的配置。那如何进行自定制的配置呢？有两种方式：一，通过package.json配置项目。先看这条命令：这意味着，要运行代码，就需要把运行：npm run serve得到这个，说明需要手动复制这个地址才能在浏览器中打开，且端口时8081。现在我们想把它改成打包完成后自动打开，而且端口号改为8888 "vue":{ "devServer":{ "port":88

2020-09-03 01:29:14 923

原创 vue脚手架学习笔记

一，概述vue脚手架用于快速生成vue项目的基础架构，其官网地址：http://cli.vuejs.org/zh/Vue CLI 致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你可以专注在撰写应用上，而不必花好几天去纠结配置的问题。与此同时，它也为每个工具提供了调整配置的灵活性，无需 eject。简单来说，就是帮你把webpack构建配置好了，程序员乖乖写代码就是了。二，安装安装3.x版本的vue脚手架：npm i -g @vue/cli三

2020-09-02 19:10:31 337

原创 npm install -g @vue/cli时 -4048 npm ERR! Error: EPERM: operation not permitted, lstat报错的几种解决方案

今天开始学习脚手架，被这个报错折服了……安装一次就好多分钟，浪费了我一个多小时来解决，转行自学狗哭晕在厕所！！！*一：网上最多的解决办法是这个：*以管理员身份运行cmd，清除缓存 npm cache clean --force。之后升级一下npm，npm install -g npm@latest。然而还是出现了上面的错误！！二：又有人说是命令行控制台需要管理员权限搞事情才行我又去试了，还是同样的报错！！为了避免这个因素也是问题原因，接下来我都是用管理员权限打开命令行三，还有人说是n

2020-09-02 17:12:37 7162 6

原创（黑马教程）-webpack学习笔记

一，webpack的初步认识在我们写代码的时候，刚开始会在html文件中引入很多相关的资源，js文件啦，图片啦，less文件啦一系列的。但是有些文件是不能直接执行的，比如less文件就需要转化为css文件才可以执行，而一些引用jq的js文件也需要一些工具处理之后才可以执行。在这之前，我们都是自己利用小工具去完成文件的预编译转化成可以执行的文件，但是这样生成的文件又多，处理又麻烦。于是懒惰而又聪明的程序员宝宝们就把这些工具集合在一起啦，形成了webpack这个静态模块打包器。换句话说：在webpa

2020-09-01 17:49:17 859

原创解决：‘webpack-dev-server‘ 不是内部或外部命令，也不是可运行的程序或批处理文件

就是这个报错。浪费了我十几分钟来解决……第一步：检查代码有没有把这行写好：写好了，依旧报错第二步：查找相关问题的博客解决问题后留言人数最多的解决方案是这个：https://blog.csdn.net/Leadyang/article/details/82705738?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-3.channel_param&depth_1-utm_source=distri.

2020-09-01 12:53:29 13922 4

weixin_42349568的博客