yycnf的博客

转树状数据

vue拖拽组件<template> <div id="webId"> <!-- 1.1 如果碰到滑动问题，请检查这里是否属于同一点。 --> <!-- 悬浮的HTML --> <div class="xuanfu" id="moveDiv" @mousedown="down()"

移动端实现如下图竖线加上下边框<div class="layer"> <div class="layer-header"></div></div>/*样式代码*/.layer{ width: 100%; background: #fff;}.layer-header{ height: 30px; position: relative; padding:0 10px;}.layer-header::before

移动端1像素边框问题.contianer{ position: relative; &::before{ content:" "; position: absolute; left:0; top:0; width:200%; height:200%; transform:scale(0.5,0.5); transform-origin:left top; border:1px solid lightgray; box-sizing:border-box;

获取url地址参数的方法

安装clipboard ： npm install clipboard --save在模板文件中引入： import Clipboard from “clipboard”具体使用： (这里我用的表格) <el-table :data="gridData" border> <el-table-column prop="documentPath" property="date" label="文件位置"

border-image-source使用注：使用border-image-source属性必须给容器添加border属性<style> .box{ width: 300px; height: 200px; border: 27px solid #aaa; /*必须有这个属性*/ background-color: #07a; border-image-source: url(../image/border-icon.png); borde

git log该命令显示从最近到最远的提交日志。每一次提交都有对应的 commit id 和 commit message。（找到需要回退的版本id）git reset --hard id该命令根据 id 回退到指定的版本git push推送到本地到远程仓库：让远程仓库代码和你本地代码一样...

js判断开始时间不能小于结束时间function validTime(startTime,endTime){ var arr1 = startTime.split("-"); var arr2 = endTime.split("-"); var date1=new Date(parseInt(arr1[0]),parseInt(arr1[1])-1,parseInt(arr1[2]),0,0,0); var date2=new Date(pars

vue 项目表格列表添加序号第一种<template slot-scope="scope"> {{ scope.$index + 1}}</template>此方法在切换页码时，还是1,2，…10第二种：结合页码+条数<template slot-scope="scope"> {{ (page - 1)*pageSize+scope.$index+1 }}</template>//page:页码//pageSize:一页显示的条数

vue项目 pc端下载功能前端请求后端接口，返回文件流//点击下载，拿到下载的文件流let data = res;//res==》请求接口拿到的文件流 /* 兼容ie内核，360浏览器的兼容模式 */ if (window.navigator && window.navigator.msSaveOrOpenBlob) { const blob = new Blob([data ], {type: "application/vnd.ms-excel;

Object.hasOwnProperty()方法使用官方解释：hasOwnProperty() 方法会返回一个布尔值，指示对象自身属性中是否具有指定的属性（也就是，是否有指定的键）具体使用：let obj = { color:red, name:tom, age:10}obj.hasOwnProperty('age'); //在控制台输出trueobj.hasOwnProperty('eating'); //在控制台输出falselet obj1 = { name:null,

js获取年份，当前年份的前后15年<template> <div> <el-select v-model="year" placeholder="选择年份" size="small" clearable > <el-option v-for="(item, i) in years" :label="item.label"

js 获取每个月的最后一天getDate() {//获取每个月的最后一天 let d = new Date(); let y = d.getFullYear();//获取年份 let m = d.getMonth() + 1;//获取月份 let dateStr = y + '-' + m; //需要获取此月最后一天的日期 let dateObj = new Date(dateStr); let nextMonth = dateObj

使用npm run dev指令报错 错误是:Cannot find module 'core-js/modules/es6.regexp.constructor'出现这个错误 莫要慌张请在命令行中输入这个代码：cnpm install core-js@2

如何根据设计图设计rem比例关于图纸通常UI会给我们的设计图，设计图的宽度一般为750px(像素)，也有设计图的宽度为640px具体操作我们主要就是根据上面的图纸宽度和手机可视窗口的宽度来设置rem比例众所周知，rem布局原理是由根元素的font-size值来决定的,通常：font-size=100px=1rem。这是怎么计算的呢？我们简单以750的设计图为例：我们可以设置一个js文件来处理rem，需要使用rem时调用即可function rem(){ //根据设备的宽设置h

什么是混合AppHybrid App是指介于web-app（网页APP，如京东web）、native-app（原生应用，如手机上面的APP应用）这两者之间的app,它虽然看上去是一个Native App，但只有一个WebView ( WebView,可以类比成iframe )，里面访问的是一个Web App，就是包了个客户端的壳，其实里面是HTML5的网页。混合开发（HybridApp开发），是指在开发一款App产品的时候，为了提高效率、节省成本而利用原生与H5的开发技术的混合应用。通俗点来说，这就

什么是 JavaScript 语言？JavaScript 是一种轻量级的脚本语言。脚本语言指的是它不具备开发操作系统的能力，而是只用来编写控制其他大型应用程序的“脚本”。 JavaScript 是一种嵌入式（embedded）语言。它本身提供的核心语法不算很多，只能用来做一些数学和逻辑运算。JavaScript 本身不提供任何与 I/O（输入/输出）相关的 API，都要靠宿主环境（host）提供，所以 JavaScript 只合适嵌入更大型的应用程序环境，去调用宿主环境提供的底层 API。宿主环境最常

webpack是什么？WebPack可以看做是模块打包机【打包工具 （静态资源打包工具） 前端必备】：它做的事情是，分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其打包为合适的格式以供浏览器使用。webpack 的特点？js依赖进行整合处理 （打包整合） 一些预处理的sass，less可以在环境中进行编译 （转换） 可以对js、html、图片等进行压缩 （优化）webpack的核心？entry ...

js的作用域、作用域链什么是作用域？JS作用域也就是JS识别变量的范围，变量的作用域分为：全局变量、局部变量。JS作用域主要包括 ：全局作用域：也就是定义在window下的变量范围，在任何地方都可以访问， 局部作用域：是只在函数内部定义的变量范围 ES6的块级作用域：简单来说用let和const在任意的代码块中定义的变量都认为是块级作用域中的变量，例如在for循环中用let定义的变量，在if语句中用let定义的变量等等 （JS是没有块级作用域的）注: 1、 尽量不要使用全局变量，.

if...else...语句条件语句用于基于不同条件执行不同的动作语法：//if...else...语句if (条件) { 条件为 true 时执行的代码块} else { 条件为 false 时执行的代码块}//if...else if...else...语句if (条件 1) { 条件 1 为 true 时执行的代码块} else if (条件 2) { 条件 1 为 false 而条件 2 为 true 时执行的代码块 } else {

css样式的优先级按照 CSS 的来源，可以将网页定义的样式分为 4 种：HTML 默认样式； 作者（网站开发者/程序员）定义的样式； 用户（网站使用者）设置的样式； 浏览器默认样式。注意：当用户设置的样式中使用了!important命令声明之后，用户的!important命令会优先于作者声明的!important命令。 根据 CSS 优先级规则：作者定义的样式能够覆盖浏览器默认设置的样式，而用户在浏览器中设置的样式可以覆盖作者的样式。 CSS 根据样式的远近关系来决定最终的优先级.

函数的参数函数的参数分为：形参、实参实参：真实传给函数的参数，叫实参。实参可以是：常量、变量、表达式、函数等。无论实参是何种类型的量，在进行函数调用时，它们必须有确定的值，以便把这些值传送给形参。形参：形式参数是指函数名后括号中的变量。因为形式参数只有在函数被调用的过程中才实例化（分配内存单元），所以叫形式参数。形式参数当函数调用完成之后就自动销毁了。因此形式参数只在函数中有效。代码演示：<!DOCTYPE html><html lang="en"><

function声明格式：function 函数名（）{}；function fn(){//函数声明 alert(11111) }//函数调用 fn();原生js点击显示/隐藏<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=devic

创建、追加、插入、删除DOM元素创建一个节点: document.createElement('标签名')var oDiv = document.createElement('div');//创建一个div标签追加一个节点：父节点.append('子节点')插入元素： insertBefore(节点,原有节点) 在已有元素前插入删除DOM元素 removeChild(节点) 删除一个节点创建、追加、插入、删除DOM元素代码演...

什么是js事件冒泡？在一个对象上触发某类事件（比如单击onclick事件），如果此对象定义了此事件的处理程序，那么此事件就会调用这个处理程序，如果没有定义此事件处理程序或事件返回true,那么这个事件会向这个对象的的父级传播，从里到外，直至它被处理（父级对象所有同类事件都将被激活），或者到达了对象层次的最顶层，即document对象。事件冒泡示例：<!DOCTYPE html><html lang="en"><head> <meta cha

在GitHub上如何创建github.iogithub网址：https://github.com/具体实现：第一步：先创建一个gitthub账号，进入如下页面：第二步：点击new这个按钮：

时间戳转换我们向后台服务器发送请求，服务器响应回来的时间数据是一串数字，转换成xx年xx月xx日 xx时xx分xx秒<template> <div> <li v-for="(item,index) in list" :key="index"> <div class="list-top"> <div> <span class="list-right">{

vue常用的指令v-if 判断v-model 双向数据绑定v-on 事件绑定 （可简写：'@'）v-show 显示/隐藏v-html 渲染HTML以及字符串v-text 渲染字符串v-bind 属性绑定 （可简写 ':'）v-for 循环指令的使用：v-for 循环指令 (主要用于对象、数组数据的循环渲染到页面指定的位置)<!DOCTYPE html><html lang="en"><head..

谈谈对vuex的理解首先我们要知道：1、vuex是什么？vuex是一个专为vue.js应用程序开发的状态管理模式（它采用集中式存贮管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化）。2、vuex五大核心属性？state：存储数据，存储状态；在根实例中注册了store 后，在组件中是用this.$store.state.变量名来访问存放在vuex里面德数据；对应vue里面的data；存放数据方式为响应式，vue组件从store中读取数据，如数据发生变化，组件也..

谈谈对登录逻辑的理解登录逻辑1、第一次登录的时候，前端（客户端）调后端（服务器）的登陆接口，并发送用户名和密码2、后端（服务器）收到（客户端）请求，验证用户名和密码，验证成功，就给前端（客户端）返回一个token3、前端（客户端）拿到token，将token存储到localStorage或vuex中，并跳转路由页面4、前端（客户端）每次跳转路由，就判断 localStroage 中有无 token ，没有就跳转到登录页面，有则跳转到对应路由页面5、在组件中每次调后端（服务器）接...

谈谈在vue项目中api的封装（理解）api的封装要用到axios模块。所以那我们在创建好vue脚手架后需要安装axios依赖包（指令：npm i axios --save）。api的封装主要的目的就是：在帮助我们简化代码和后期的更新维护。axios封装在vue项目中，和后台交互获取数据这块，我们通常使用的是axios库，它是基于promise的http库，类似于JQ中的ajax，用于HTTP请求，可运行在浏览器端和node.js中。他有很多优秀的特性，例如支持promise API、拦截.

meta标签定义及使用说明官方解释：元数据（Metadata）是数据的数据信息。<meta> 标签提供了 HTML 文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。META元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者及其他元数据。元数据可以被使用浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 Web 服务调用。注：所有主流浏览器都支持 <meta> 标签。meta标签里面的属性： viewpor.

文本只显示一行超出部分隐藏给要一行显示的内容的容器加入以下属性： display: inline-block;//设置行内块属性 white-space: nowrap; //强制不换行 width: 100%; //固定盒子的宽度 overflow: hidden;//超出部分隐藏 text-overflow:ellipsis;//显示‘...’演示：上图为没有加一行显示属性，代码如下：<!DOCTYPE html><html lang="

v-text指令用于将数据填充到标签中，作用于插值表达式类似，但是没有闪动问题 （如果数据中有HTML标签会将html标签一并输出 ）注意：此处为单向绑定，数据对象上的值改变，插值会发生变化；但是当插值发生变化并不会影响数据对象的值 <div id="app"> <!-- 注意:在指令中不要写插值语法 直接写对应的变量名称 在 v-text 中 赋值的时候不要在写 插值语法 一般属性中不加 {{}} 直接写 对应 的数据名 --&

使用vue实现以下效果：1、创建vue项目vue create libary2、cd libary 进入libary文件3、下载需要用到的模块（这里用的是element-ui）cnpm i element- ui --save4、启动项目npm run serve5、配置main.js文件import ElementUi from "element-ui";//引入element-ui模块import "element-ui/lib/theme-cha...

http、http2、https2.0的区别首先要知道http、http2、https的核心http核心：http本身是一种协议，也是一种请求。每次发送一次请求，无论是get请求还是post请求，它都需要两部分组成：头部和身体。传输量：get请求传输量较小，post请求传输量较大安全性：get不安全，post相对安全缓存方式：get请求过程中会有缓存，而post是没有缓存的http的特点：1、简单快速：请求服务时，只需传送请求方式和路径2、较灵活：http允许传输任意类型

v-cloak的作用？v-cloak指令的作用：防止页面加载时出现闪烁问题（解决插值表达式的闪烁问题）；为什么会有闪烁问题昵？代码加载的时候先加载HTML，把插值语法当做HTML内容加载到页面上，当加载完js文件后才把插值语法替换掉，所以我们会看到闪烁问题。<html> <style type="text/css"> /* 1、通过属性选择器 选择到 带有属性 v-cloak的标签 让他隐藏 */ [v-cloak]{ /* 元素隐

跨域产生的原因产生跨域的原因：同源策略同源策略：是对ajax的一个主要约束，它为通信设置了“相同的域、相同的端口号、相同的协议”这一限制跨域产生的5中情况http://a.com 和 http://b.com 不允许访问(不同域)http://a.com 和 https://a.com 不允许访问(同一域名，不同协议)http://a.com 和 http://a.com:8080 不允许访问(同一域名，不同端口)http://a.com 和 http://192.1

vue的安装过程1、徽标键+R，打开命令窗口。输入cmd命令打开小黑框,输入node-v（检测node版本号）和cnpm -v（检测cnpm的版本号）如果没有安装cnpm，需要先安装cnpm2、安装vue脚手架指令一般都是全局安装：cnpm i -g @vue/cli如下图就代表安装成功3、在D盘、E盘，或F盘创建新文件夹（名字不能是汉字）4、进入新文件夹，在地址栏输入cmd，回车。5、在第4步执行完后，会弹出一个小黑框，输入vue create 项目名.