z2428478096的博客

原创 js数组里的方法30个总合

1.concat()concat() 方法用于连接两个或多个数组。方法不会更改现有数组，而是返回一个新数组，其中包含已连接数组的值。var str1 = [1,2,3,4,5,6]var str2 = ['a','b','c','d','e']console.log(str1.concat(str2));//[1, 2, 3, 4, 5, 6, 'a', 'b', 'c', 'd', 'e']2.copyWithin()copyWithin() 复制数组的一部分数据覆盖到数组的另一个.

原创 使用Vue-cli从零开始搭建Vue全家桶(仿b站客户端)项目(3.主页和视频播放页面的实现)

主页分为三个板块：1.轮播图 2.虚拟直播板块 3.推荐内容板块实现主页内容需要用到Element.ui里的Carousel 走马灯(轮播图)、Card 卡片(推荐内容)组件。对于轮播图的功能是点击跳转到b站官方网页，点击虚拟直播板块显示功能还未开放，点击推荐内容则跳转到播放页面进行视频播放。实现主页内容的步骤为：1.通过Axios来获取接口数据，把获取到的数据进行分类 2.把获取的数据渲染到主页页面 3.点击主页轮播图跳转到b站官方网页 4.点击虚拟直播板块弹出警告框提示：功能...

原创 使用Vue-cli从零开始搭建Vue全家桶(仿b站客户端)项目(2.导航栏与个人中心的实现)

用户登录后，应该让用户跳转到个人中心。而个人中心是在主页当中。主页是由个人中心、推荐、分区、动态这些页面组成，每个页面具有各自的功能。首先我们要完成的是个人中心页面的具体功能。实现主页导航栏的思维因为个人中心、推荐、分区、动态这些页面是以导航栏的方式在页面的最上方，所以刚开始我是想把他们放在app.vue页面，但是发现这样会让所有页面都显示导航栏，所以我是创建一个nav组件来把导航栏跳转页面功能都放入其中，在让以上的页面都引入这个组件，这样就让主页完成了导航栏跳转功能。1.导航栏创造一个

原创 使用Vue-cli从零开始搭建Vue全家桶(仿b站客户端)项目(1.环境配置、实现登录功能)

二、环境配置1.先打开VsCode创建一个项目文件夹，右键打开终端。输入指令：vue create bilibili2.选择预设，我们选择自定义3.选择配置文件，中间有一步是选择vue的版本，我忘记截图了，选择2.0x就行了4.开始，完成以上步骤后我们cd到目前的文件夹下，执行 npm run serve5.按住ctrl点击左键进入6.然后我们ctrl+v先退出运行...

原创 解决Vue项目最外部有一个html元素导致宽度不能完全填充整个浏览器方法

在用Vue-cli搭建一个项目启动后，设置宽度100%发现内容没有完全填充浏览器宽度，上边和左边都有空白代码<template> <!--登陆页面--> <div class="login"> <!-- 登录头部图片 --> <img src="@/assets/images/error.png" alt=""> </div></template>&lt

原创 初步了解Vue3响应式原理

1.Vue3与Vue2响应式的不同。vue2的问题：1.新增属性、删除属性，界面不会更新 2.直接通过下标修改数组，界面不会自动更新。 而在Vue3中则解决了这些问题，Vue3的响应式两部分不同：1.通过Proxy(代理)：拦截对象中任意属性变化，包括：属性值的增删改查等。2.Reflect(反射)：对源对象的属性进行操作。 // 数据 let person = { name:'张三', age:18 } // 模拟vue...

原创 git常用命令和使用git上传至远程库

一.常用命令1.git常用命令git config --global user.name 用户名 设置用户签名git config --global user.email 邮箱 设置用户签名git init 初始化本地库git status 查看本地库状态gi...

原创 Vue的生命周期

一、生命周期方法详解钩子函数 详情 场景 备注 beforeCreate 实例初始化之后，组件被创建时期，这个时候的 el，data，message 都是 underfined 可以加入 loading 事件；在服务器端的应用场景中，这个时候发送数据请求比较多一些 created 实例创建完成后，data、methods 被初始化 结束 loading 事件；推荐这个时候发送请求数据，尤其是返回的数据与绑定事件有关时 beforeM.

原创 React的生命周期

一、react生命周期函数组件将要挂载时触发的函数：componentWillMount 组件挂载完成时触发的函数：componentDidMount 是否要更新数据时触发的函数：shouldComponentUpdate 将要更新数据时触发的函数：componentWillUpdate 数据更新完成时触发的函数：componentDidUpdate 组件将要销毁时触发的函数：componentWillUnmount 父组件中改变了props传值时触发的函数：componentWillRe

原创 uni-app的使用

uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。1.pages.json的配置pages.json文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。它类似微信小程序中app.json的页面管理部分。注意定位权限申请等原属于app.json的内容，在un...

原创 Vue的MVVM实现原理

vue是采用数据劫持配合发布者-订阅者模式的方式，通过object.definerProperty()来劫持各个属性的setter和gettter，在数据变动时，发布消息给依赖收集器，去通知观察者，做出对应的回调函数，去更新视图。 MVVM作为绑定的入口，整合Observer，Compile和Watcher三者，通过Observer来监听model数据变化表，通过Compile来解析编译模板指令，最终利用Watcher搭起Observer，Compile之间的通信桥梁，达到...

原创 webpack.config.js的基本配置

一.webpack的五个核心概念1.Entry入口(Entry)指示webpack以那个文件为入口起点开始打包，分析构建内部依赖图2.Output输出(Output)指示webpack打包后的资源bundles输出到哪里去，以及如何命名3.LoaderLoader让webpack能够去处理哪些非JavaScript文件(webpack自身只理解JavaScript)4.Plugins插件(Plugins)可以用于执行范围更广的任务。插件的范围包括，从打包优化和压缩，一直到重新定义环

原创 关于js里的深拷贝和浅拷贝理解

js里的深拷贝、浅拷贝类型深拷贝类型：基本数据类型(number strting undefind null boolean symbol)浅拷贝类型：引用数据类型(function array object data)1.深拷贝let a = 1; let b = a; a = 2; console.log(b); //b=1 上面的代码在栈和堆内存中发生的变化：基本数据类型会在栈内存中创建a = 1、因为let b = a...

原创 vue项目两种简单易懂的模拟获取后端接口数据方法

原创 解决vue项目运行后使用require()图片也不显示方法

最近在写vue项目时发现一个问题，在项目运行打包后却没有显示图片，明明路径也是正确的。在网上查询大部分文档都是说使用require(‘图片路径’)可以进行解决，运用到项目中发现还是没有用，到后面我对require方法进行查询后，得到了解决办法。比如：我在assets下的images存放了图片，运行后这样不显示解决办法：<img class="headimg" :src="require(imgurl2)">使用require('图片存放目录' + 图片地址...