- 博客(29)
- 收藏
- 关注
原创 Vue学习笔记之Vue计算属性
秋招过后,意识到自己的不足,最近又重新复习了一下codewhy老师的Vue,今天跟大家分享一下Vue插值的操作文章目录一、计算属性的基本使用示例:二、计算属性的复杂操作示例:总结一、计算属性的基本使用示例:<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-w
2021-12-09 11:57:26 912
原创 Vue学习笔记之动态绑定属性
秋招过后,意识到自己的不足,最近又重新复习了一下codewhy老师的Vue,今天跟大家分享一下Vue动态绑定属性的知识文章目录一、v-bind的基本使用示例:二、v-bind动态绑定属性class(对象语法)示例:三、v-bind动态绑定属性class(数组语法)示例:四、v-bind动态绑定style(对象语法)示例:五、v-bind动态绑定style(数组语法)示例:总结一、v-bind的基本使用v-bind最常见的用法就是我们来绑定一个属性比如图片属性示例:<!DOCTYPE ht
2021-12-08 22:47:00 1347
原创 Vue学习笔记之Vue插值的操作
秋招过后,意识到自己的不足,最近又重新复习了一下codewhy老师的Vue,今天跟大家分享一下Vue插值的操作文章目录一、Mustache语法示例:二、v-once指令的用法示例:三、v-html指令的用法示例:四、v-text指令的用法示例:五、v-pre指令的用法示例:六、v-cloak指令的用法示例:总结一、Mustache语法我们使用Vue的时候,想要将data里面定义的数据放到HTML里面来显示,这时候就会用到我们的Mastache语法,也就是双大括号{{}}的一个用法示例:<
2021-12-08 20:52:00 875
原创 在vue中使用Echarts绘制图表
在脚手架的依赖选项里面虚选择安装依赖,运行依赖搜索echarts找到对应依赖并安装项目中导入Echarts并且根据官方文档添加Echarts的相关结构如果导入了相关结构发现报错无显示等情况的话先卸载echarts依赖,安装指定的低版本的echarts试试看成功如下:...
2021-08-12 18:38:24 745
原创 Vue报错Property or method “manyData“ is not defined on the instance but referenced during render
今天写项目的过程中遇到了这个问题,Property or method “manyData” is not defined on the instance but referenced during render,翻译了一下是说属性或方法“manyData”不是在实例上定义的,而是在渲染过程中被引用的这就说明在data上没有定义该数据或者是定义了数据引用错了,我这里是太粗心把数据放错地方了,仔细检查放到data下引用正确就解决了...
2021-08-12 16:33:07 489
原创 Element-ui的使用
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、基于命令行方式手动安装二、基于图形化界面自动安装1.运行vue ui命令,打开图形化界面2.通过Vue项目管理器,进入具体的项目配置面板3.点击插件,添加插件,进入插件查询面板4.搜索vue-cli-plugin-element并安装5.配置插件,实现按需导入,从而减少打包后项目的体积总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习
2021-08-04 20:55:41 13912 1
原创 Vue脚手架的基本用法
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、安装脚手架二、使用步骤1.引入库2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、安装脚手架示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库可以选择默认可以
2021-08-04 20:51:53 681
原创 前端小案例之tab栏切换
最近学习vue的时候用vue实现了一个简单的tab栏切换,分享给大家文章目录一、案例介绍?二、案例代码总结一、案例介绍?效果如下:该案例主要是在tab盒子上面放一个ul里面有五个小li,下方对应的是五个盒子,通过控制下面图片盒子的显示隐藏和对比currentIndex和index的值来对应显示相应的盒子。二、案例代码代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset=.
2021-07-31 13:11:45 931
原创 开发一个属于自己的npm包
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、初始化包的基本结构1.新建 vegetable-wen 文件夹,作为包的根目录2.在 vegetable-wen 文件夹中,新建如下三个文件:二、使用步骤1.引入库2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、初始化包的基本结构
2021-07-26 20:22:36 1205
原创 Git的安装和使用(详细)
最近又详细看了一下git,将git使用的一些方法分享给大家。文章目录前言一、Git安装二、使用步骤1.配置用户信息2.Git 的全局配置文件3.获取帮助信息4.在现有目录中初始化仓库5.检查文件的状态6.跟踪新文件7.提交更新8.对已提交的文件进行修改9.暂存已修改的文件10.提交已暂存的文件11.撤销对文件的修改12.向暂存区中一次性添加多个文件13.取消暂存的文件14.跳过使用暂存区域15.移除文件16.忽略文件17.查看提交历史总结前言Git 是一个开源的分布式版本控制系统,是目前世界上最先
2021-07-12 13:11:58 3654
原创 art-template模板引擎
最近看art-template模板引擎的知识分享给大家文章目录前言一、模板引擎是什么?二、使用模板引擎的好处art-template模板引擎的使用总结前言使用传统方式渲染UI结构需要手动操作大量的DOM,模板引擎可以减少我们的DOM操作,提供数据和空白模板,模板引擎就会自动生成新页面。一、模板引擎是什么?模板引擎,可以根据程序员指定的模板结构和数据,自动生成一个完整的HTML页面。二、使用模板引擎的好处减少了字符串的拼接操作使代码结构更清晰使代码更易于阅读与维护art-temp
2021-07-08 11:29:04 240
原创 es6 let、const关键字
最近看JavaScript有关es6 let、const关键字的知识分享给大家文章目录前言一、let二、使用步骤1.引入库2.读入数据总结前言Js中var、let、const关键字都是用来声明变量的,但是它们之间是有区别的使用的场景也不一样。一、letlet关键字就是用来声明变量的let a = 10;console.log(a);使用let关键字声明的变量具有块级作用域在这里插入代码片二、使用步骤1.引入库代码如下(示例):import numpy as np
2021-07-06 21:59:24 289
原创 JS学习笔记之闭包
最近看JavaScript有关闭包的知识分享给大家文章目录一、闭包是什么?例如:解析:二、闭包的作用在全局作用域下也可以访问一个函数内部的局部变量例如:解析:总结一、闭包是什么?闭包指的是有权访问另一个函数作用域中变量的函数,简单来说就是一个作用域可以访问另一个函数内部的局部变量。例如:function fn() { var a = 10; function fn1() { console.log('a的值:' +
2021-07-02 18:19:39 213
原创 JS学习笔记之构造函数和原型、原型链
最近看JavaScript有关构造函数和原型的知识分享给大家文章目录一、构造函数?二、原型?1.构造函数原型对象prototype2.对象原型__proto__3.原型constructor构造函数4.原型链总结一、构造函数?构造函数是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与new一起使用。我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面。// 定义一个People构造函数 function People(name, age, he
2021-06-28 14:18:03 320
原创 swiper插件的使用
最近在写项目的时候发现可以使用一个插件帮助我们写轮播图1.打开swiper官网2.使用swiper1.首先在获取swiper这里选择下载swiper2.然后点击第一个选项即可下载3.解压后打开目录,看到里面有一个package包点进去,找两个文件swiper-bundle.min.css和swiper-bundle.min.js4.将这两个文件分别放到你项目里面的css文件夹和js文件夹中,并且在页面中引入。5.在官网的在线演示里选择swiper基础演示,然后选择喜欢的案例在
2021-06-03 17:26:39 491 1
原创 rem和em的区别
最近在学习移动端布局相关的内容将rem单位有关的知识分享给大家rem和em的区别em:是相对于父元素的字体大小来说的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="
2021-05-24 08:39:33 133
原创 align-items和align-content的区别
最近在学习flex布局相关的内容将align-content和align-items的区别分享给大家flex布局align-items和align-content的区别align-content:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
2021-05-20 08:57:55 447
原创 JS学习笔记之mouseenter和mouseover的区别
最近在学习JavaScript的时候将mouseenter和mouseover的区别分享给大家鼠标事件mouseenter和mouseover共同:当鼠标移动到元素上时就会触发事件区别:mouseover鼠标经过自身盒子会触发,经过子盒子还会触发。mouseenter只会经过自身盒子触发原因:mouseenter不会冒泡跟mouseenter搭配鼠标离开mouseleave一样不会冒泡总结以上就是今天要跟大家分享的鼠标事件mouseenter和mouseover的区别。...
2021-05-13 08:56:00 205
原创 JS学习笔记之element.offsetWidth、element.clientWidth、element.scrollWidth的区别
最近在学习JavaScript的时候将element.offsetWidth、element.clientWidth、element.scrollWidth的区别以及三个系列的用法分享给大家一、作用对比:1.element.offsetWidth:返回自身包括padding、边框、内容区的宽度、返回数值不带单位2.element.clientWidth:返回自身包括padding、内容区的宽度、不含边框、返回数值不带单位3.element.offsetWidth:返回自身实际宽度、不含边框,返回
2021-05-12 20:41:15 402
原创 前端小案例之仿淘宝固定侧边栏
简单仿淘宝固定侧边栏案例-通过添加页面滚动事件实现相应效果最近入门学习前端用简单的html结构加CSS样式还有js写了个仿淘宝固定侧边栏案例的小案例在这里分享给大家。文章目录简单仿淘宝固定侧边栏案例-通过添加页面滚动事件实现相应效果一、案例介绍?二、案例代码总结提示:以下是本篇文章正文内容,下面案例可供参考一、案例介绍?效果如下:该案例有四个盒子,slider-bar、header、main、footer将slider-bar侧边栏盒子先用绝对定位定位到右侧,其他三个盒子依次居中对齐放
2021-05-12 20:19:27 464
原创 JS学习笔记之立即执行函数
最近在学习JavaScript,将立即执行函数的知识分享给大家。文章目录一、什么是立即执行函数?二、对比1.普通函数的声明要调用2.立即执行函数声明不需要调用总结一、什么是立即执行函数?立即执行函数不需要调用,立马能够自己执行的函数。二、对比1.普通函数的声明要调用代码如下:function fn() { console.log(1);}fn();声明了之后还要调用才会执行。2.立即执行函数声明不需要调用代码如下:(function sub(a, b) { c.
2021-05-11 17:42:47 232
原创 icoMoon向原有的追加字体图标
字体图标想必前端人员在项目中使用都比较多,最近写一个前端小项目的时候遇到之前字体图标不够用需要追加的问题在这里分享给大家文章目录总结1.首先打开icomoon的官网。2.点击如图的紫色按钮import icons将之前下载好的压缩包里面的selection.json文件导入。3.然后选择想要添加进去的图标选择完后点击左下角的按钮添加,选好后点击右下角的按钮进行新的压缩包下载,最后把自己原来解压的字体图标文件夹删除把新的压缩包解压到原来的位置就是用新的覆盖掉原来的。4.最后运用到项目中.
2021-05-09 15:59:55 572 3
原创 Git学习之git push指令将代码提交到github
最近学习git,将git push的方法分享给大家。文章目录前言一、创建新仓库1.首先先在远程仓库新建一个跟你本地仓库一样名字的空仓库,进行相关选择后点击create。2.填写相关信息二、在本地仓库进行操作1.首先我们来到本地项目里面,有一个test.txt文件点击Git Bash Here2.使用相关指令对本地仓库进行操作3.回到github上就可以看到本地仓库的内容已经推送到远程仓库上啦总结前言有时候你在本地创建一个仓库后,又想上传到github上面去进行远程同步,这时候就可以使用git pu
2021-05-03 11:17:15 1156
原创 JS学习笔记之三种动态创建元素区别
最近在学习JavaScript的时候动态创建元素区别的内容将笔记分享给大家文章目录前言一、三种方法:1.代码如下:2.分析:二、innerHTML和document.createElement创建元素1.代码如下:2.分析:总结前言JS有三种方法来创建动态元素,分别是:1.document.write()2.innerHTML3.document.createElement()一、三种方法:1.代码如下:<!DOCTYPE html><html lang="en
2021-04-19 18:16:14 306 4
原创 JS学习笔记之数据类型传参
JS数据类型传参笔记最近在学习JavaScript的时候遇到了简单和复杂数据类型传参的内容将笔记分享给大家文章目录JS数据类型传参笔记前言一、简单数据类型和复杂数据类型是什么?二、案例说明1.简单数据类型传参2.复杂数据类型传参总结前言首先我们知道操作系统会把内存分成两大类,简单数据类型是存放到栈里面的,复杂数据类型是存放到堆里面的。一、简单数据类型和复杂数据类型是什么?1.简单数据类型:又叫做基本数据类型或者值类型,在存储时变量中存储的是值本身,因此叫做值类型如:(string,num
2021-01-17 14:59:22 653 2
原创 JS学习笔记之JS预解析
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、pandas是什么?二、使用步骤1.引入库2.读入数据总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、pandas是什么?示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码
2020-12-24 12:56:07 4705 11
原创 前端小案例之3D导航栏
简单3D导航栏案例-鼠标经过盒子时底部盒子旋转最近入门学习前端用简单的html结构加CSS样式写了个3D导航栏的小案例在这里分享给大家。文章目录简单3D导航栏案例-鼠标经过盒子时底部盒子旋转一、案例介绍?二、案例代码1.HTML结构2.CSS样式总结一、案例介绍?效果如下:该案例主要是在一个navbar导航栏的盒子里面放几个li,每个li里面包含一个span便签和一个链接,这个span标签是初始正对着我们的,当我们用鼠标经过这个li下面的span时,就把下面的a便签也就是链接旋转上来并且
2020-12-22 16:23:06 4063 9
原创 前端小案例之侧边栏
简单侧边栏案例-隐藏右边盒子鼠标经过时显示最近刚入门前端写了个侧边栏的小案例文章目录简单侧边栏案例-隐藏右边盒子鼠标经过时显示前言一、pandas是什么?二、使用步骤1.引入库2.读入数据总结前言该侧边栏的案例呢大概是经过侧边栏盒子下每个li的字体会有一个过渡效果padding值的撑开,提示:以下是本篇文章正文内容,下面案例可供参考一、pandas是什么?示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下(示例)
2020-12-20 19:04:06 13824 34
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人