- 博客(33)
- 收藏
- 关注
RSS订阅原创 vuex的概念和在使用vuex出错以及解决方法
问题：首先多数小伙伴们可能刚刚开始都会默认去main.js文件里面用import引入vuex插件，并且直接用vue.use(vuex)去使用它，然后在后面再次引入store.js文件，以为会按照顺序从上往下来依次读取执行，其实不对，最先会执行所有的import引入的文件，然后再会读取并且执行其他的，所以本来都是写了，结果却是错误的，就如同出现下面的问题。可以建一个store文件夹，里面新建一个js文件，把vuex引入这里面并且使用，然后再在main.js里引入store文件。...............
2022-08-10 14:14:03
1314
原创 vscode vue2.0的vuex插件安装失败原因
出现这种问题，原因在于vue版本在3.0以下，vuex版本高于4.0，所以无法进行使用。1.学习vue2时，直接下载vuex插件有的会出问题。
2022-08-10 13:14:06
910
原创 初识Vue，走进Vue的世界
Vue是一套用于构建用户界面的渐进式JavaScript框架简单应用:只需一个轻量小巧的核心库，复杂应用:可以引入各式各样的Vue插件；采用组件化模式，提高代码复用率、且让代码更好维护。声明式编码，让编码人员无需直接操作DOM,提高开发效率。...
2022-07-29 10:13:19
320
原创 认识Git以及了解它的使用
Git是一个开源的分布式版本控制系统，是目前世界.上最先进、最流行的版本控制系统。可以快速高效地处理从很小到非常大的项目版本管理。特点项目越大越复杂，协同开发者越多,越能体现出Git的高性能和高可用性!...
2022-07-26 17:44:47
358
原创 npm的使用
npm是Node.js默认的软件包管理系统安装完毕node后，会默认安装好npmnpm本身也是基于Node.js开发的软件下载Nodehttp。
2022-07-26 17:03:24
758
原创 了解HTTP协议
通信协议(CommunicationProtocol)是指通信的双方完成通信所必须遵守的规则和的定。通俗的理解通信双方采用约定好的格式来发送和接收消息，这种事先约定好的通信格式，就叫做通信协议。HTTP协议即超文本传送协议(HyperTextTransferProtocol)，它规定了客户端与服务器之间进行网页内容传输时，所必须遵守的传输格式。例如●客户端要以HTTP协议要求的格式把数据提交到服务器●服务器要以HTTP协议要求的格式把内容响应给客户端HTTP协议的交互模型。...
2022-07-26 15:59:05
264
原创 认识Ajax，体验Ajax
XMLHttpRequest(简称xhr)是浏览器提供的Javascript对象,通过它,可以请求服务器上的数据资源。上面所学的jQuery中的Ajax函数,就是基于xhr对象封装出来的。简单的认识了一些Ajax入门的知识点，利用这些知识可以从服务器上获取或提供资源请求上到页面做一些简单的页面渲染，体验Ajax能让我们轻松实现网页与服务器之间的数据交互。...
2022-07-26 15:38:20
260
原创 初入jQuery
前言 这次是初学jQuery的知识，学习之后觉得jQuery是一个快速、 简洁的JavaScript库,其设计的宗旨是"write Less , Do More”, 即倡导写更少的代码,做更多的事情。把js中的DOM操作做了封装,我们可以快速的查询使用里面的功能。jQuery封装了JavaScript 常用的功能代码,优化了DOM操作、事件处理、动画设计和Ajax交互。学习jQuery本质:就是学习调用这些函数(方法)。jQuery出现的目的是加快前端人员的开发速度,我们可以非常方便的调用和使用它,从
2022-06-08 17:25:52
201
原创 简单有趣的小蛇成长游戏--贪吃蛇
随着科技的发展，现在手机的功能已不仅仅是简单的打接电话、收发短信了。更多的手机用户希望在工作、学习余通过方便灵巧可随身携带的仪器休闲娱乐。因此，为了迎合众多用户的需求并适应现在手机的规模，我们开发出一套适合各阶层人士的具有很强的娱乐性和交互性的贪吃蛇小游戏。具有的功能：当用户进入游戏主界面时，可在界面中下方显眼的位置找到开始按钮，点击后用户可进行新游戏。当用户点击”开始游戏“按钮后，蛇的方向默认从左到右方向移动。2.2.2键盘控制方向运动功能用户可通过使用键盘上的上下左右方位键控制蛇的移动方向，蛇
2022-06-08 15:37:16
876
1
原创 有趣的小米网站
前言检验成果的时候到了！这次的写的是一个小米官网页面 ，这个项目是由html+css+JavaScript三个结合写的，从学习JavaScript的时候，知道它能做许多页面的交互效果，提高用户的体验感！ 它可以使页面跳动起来，感觉效果应该会不错。所以就来尝试了一下，感受JavaScript带来的美好体验。一、首页顶部布局和这个首页我是大体分为 header 和 banner两个部分，然后再将header拆分为了头部分（head）和头部导航栏（nav-header）两部分，并且以按照标准流的上
2022-05-23 09:39:31
490
原创 移动端轮播图和pc端
移动端轮播图功能和PC端基本一致。实现功能：可以自动播放图片 手指可以拖动播放轮播图具体的实现步骤：1. 自动播放功能：① 开启定时器② 移动端移动可以使用CSS3的translate移动。注意，使用translate不需要添加就可以移动③ 想要图片优雅的移动，就需要添加过渡效果2. 自动播放功能-无缝滚动：① 注意，我们判断条件是要等到图片滚动完毕再去判断，就是过渡完成后判断② 此时需要添加检测过渡完成事件transitionend③ ...
2022-04-29 23:19:11
704
原创 模仿京东放大镜的效果
主要练习元素偏移量 offset的系列一、目标实现效果二、实现过程及其思路展示1、给鼠标设置一个'mouseover'事件在鼠标经过的时候可以将遮罩层和右边的放大图片显示设置为块级显示（页面加载时这两个为none也就是隐藏的状态），再给鼠标设置一个'mouseout',在鼠标超出图片所在范围的时候再将上面的两个属性的display设置为none，再次隐藏起来。2、鼠标添加'mousemove'事件，再鼠标移动的时候给遮罩层赋予一个坐标跟随鼠标的移动而移动，而且需要在此时给右边的被放.
2022-04-29 22:59:26
337
原创 不一样的筋斗云
实现的功能① 鼠标经过某个小li，筋斗云跟着到当前小li的位置② 鼠标离开这个小li，筋斗云就复原为原来的位置③ 鼠标点击了某个小li，筋斗云就会留在点击这个小li的位置具体实现思路如下：利用动画函数做该动画效果原先的筋斗云的起始位置是0鼠标经过某个小li，就把当前小li的offsetLeft位置作为目标值即可鼠标离开某个小li，就把目标值设为0html--页面布局<!-- 页面布局 --><body> <div id=
2022-04-29 22:12:17
114
原创 JavaScript 之 BOM对象（下）
一、offset、client、scroll三大家族介绍及案例1. 元素偏移量 offset系列1.1 offset概述offset翻译过来就是偏移量,我们使用offset系列相关属性可以动态的得到该元素的位置(偏移)、小等。●获得元素距离带有定位父元素的位置●获得元素自身的大小(宽度高度)●注意:返回的数值都不带单位offset系列常用属性:offset系列属性 作用element.offsetTop 返回元素相对带有定位父元素上...
2022-04-29 21:55:01
1008
原创 JavaScript之BOM对象（上）
前言接着上回的Dom对象的来讲，这次是BOM对象，BOM 即浏览器对象模型。它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是window.，BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性。好奇吗？开始我也好奇，所以我就去学习探索了一些，简单的说一些我探索的成果吧！一、BOM的相关介绍1.BOM与dom的区别DOM就是把「文档」当做个「对象」来看待，而BOM把「浏览器」当做一个「对象】来看待，DOM 的顶级对象是document，BOM的顶级对象是window
2022-04-29 21:11:26
1109
原创 Web API介绍及DOM对象（下）
一、节点操作1.节点概述网页中的所有内容都是节点(标签、属性、文本、注释等) , 在DOM中,节点使用node来表示。HTML DOM树中的所有节点均可通过JavaScript进行访问,所有HTML元素(节点)均可被修改,也可以创建或删除。一般地， 节点至少拥有nodeType (节点类型)、nodeName (节点名称)和nodeValue (节点值)这三个基本属性。●元素节点nodeType为1●属性节点nodeType为2●文本节点nodeType 为3 ( 文本节点包含文
2022-04-15 20:31:08
836
原创 Web API介绍及DOM对象（上）
前言之前学习JS基础阶段，我们学习的是 ECMAScript标准规定的基本语法，目的是为了JS后面的课程打基础、做铺垫， 因为只学习基本语法,做不了常用的网页交互效果，所以就需要webAPIS，Web APIs是W3C组织的标准，它主要学习DOM和BOM，是我们JS所独有的部分，我们主要学习页面交互功能，目前先了解一下DOM对象。一、DOM介绍1.什么是DOM文档对象模型( Document Object Model ,简称DOM) , 是W3C组织推荐的处理可扩展标记语言( HTML或.
2022-04-15 19:18:13
746
原创 javascript函数以及对象
前言这次的学习是关于函数和对象的内容，函数应该都不陌生，在上学中的时候数学就已经在接触了，不过虽然都是函数，但是有不同，一个是公式，一个是代码，那它可以带来什么的可能性呢，那就带你看看它的魅力吧！对象是什么？万物皆对象，生活中的对象是生动形象的，当然这个对象也是不错的。一、JS的函数以及应用1.函数的概念在JS里面,可能会定义非常多的相同代码或者功能相似的代码,这些代码可能需要大量重复使用。虽然for循环语句也能实现一些简单的重复操作,但是比较具有局限性,此时我们就可以使用JS中的函
2022-04-06 18:14:58
2313
原创 初识JavaScript，体验JS的美好
前言此次打卡的是一种新的语言，名为 JavaScript，简称 js，是-种运行在客户端的脚本语言，脚本语言意思是不需要编译,运行过程中由js解释器(js引擎)逐行来进行解释并执行。是不是感到一些好奇呢？现在就带着好奇来感受这个新语言的魅力吧！一、JavaScript的组成ECMAScript DOM BOM1、Javascript语法 页面文档对象模型 浏览器对象模型ECMAScript : ECMAScrip...
2022-03-30 16:40:39
1616
2
原创 “生活资讯网“ 的心得
前言最近在做一个"生活资讯网"的项目，做了一个礼拜算是勉强完成了，是一个比较完善的项目，前两天一直在做一个页面，调整各种位置样式和错误，因为要在不同尺寸屏幕下呈现不同的界面，其中还有跳转很多个页面，不过其中多数的页面基本上样式都是一样的，需要修改一些文字和图片，最重要的是先完成首页的部分，后面的就比较好一点，改细节问题。1.项目介绍生活资讯网是一款发布生活资讯新闻的网站。主要为人们提供各类生活资讯，如饮食健康、生活常识、美容养生等全面广阔的内容，本站可以让您能轻易找到您想要的各类生活知识。本网站
2022-03-24 17:09:29
425
原创 前端之移动web开发（下）
前言这次想要分享的是后面几个比较重要的部分，包括rem适配方案、响应式开发和Bootstrap前端开发框架。一、rem适配方案1．我们适配的目标是什么?让一些不能等比自适应的元素,达到当设备尺寸发生改变的时候,等比例适配当前设备。2.怎么去达到这个目标的?使用媒体查询根据不同设备按比例设置html的字体大小，然后页面元素使用rem做尺寸单位，当html字体大小变化元素尺寸也会发生变化，从而达到等比缩放的适配。3、rem实际开发适配方案①按照设计稿与设备宽度的比例,..
2022-03-15 11:18:50
650
原创 前端之移动WEB开发（上）
前言最近学的是移动web开发的一些知识点，其中包括媒体查询、less的介绍和使用rem适配方案、Bootstrap前端开发框架以及响应式开发，此次为大家分享前面两个，如下：一、媒体查询1、什么是媒体查询媒体查询( Media Query )是CSS3新语法。使用 @media查询.可以针对不同的媒体类型定义不同的样式@media 可以针对不同的屏幕尺寸设置不同的样式当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面目前针对很多苹果手机、 Android手
2022-03-15 09:45:54
299
原创 年终总结之前端
时间一晃而过，转眼间20121已接近尾声。在这段试用期中可以说是有喜也有忧。和这里的伙伴们一起学习相处中，自己慢慢转变为学习者。记得初这个学习团队时， 还很陌生、有点不习惯，后来几天慢慢的稍微好了一点，也在沉下心的进入学习氛围中，很久都没有的感觉。正式开始学习前端已经过去一个多月的时间了。期间了解了HTML与CSS 的常用知识，静态网页也练习写了好几个。出现的问题确实不少，其中有几个比较大是问题。1、对于比较复杂的网页，不能很好的去分析网页的结构和布局，存在不知道在什么时候该用什么标签的情况。..
2022-01-23 11:04:19
425
原创 Flex伸缩布局，带你走进简洁的代码，一种新的体验
前言简单来讲flex伸缩布局是咱们移动端布局比较经常使用的一种方式，移动端布局还有流式布局，less+rem+媒体查询布局这些都是单独制做移动端页面的一些布局方式。布局这里主要介绍一下flex伸缩布局，由于它有不少优势，好比操做方便，布局很是简单，在移动端运用很普遍。一、移动端基础移动端浏览器我们主要对webkit内核进行兼容我们现在开发的移动端主要针对手机端开发现在移动端碎片化比较严重，分辨率和屏幕尺寸大小不一学会用谷歌浏览器模拟手机界面以及调试1、视口视口( viewpor..
2022-01-22 17:35:34
895
4
原创 万事万物皆对象
前言“万事万物皆对象” 我理解认为是男女之间的对象、人与人之间的对象；后来理解的是宇宙的一切存在形式皆是对象,对象是事物存在形式 "Thinking in JAVA中所说的万事万物皆对象"是指对象的普遍性,暗示对象开发的这种方法的广泛适应性.学了前端后，理解的又是不同，js前端对象。一、java中的对象1. 面向对象是什么？面向对象是流行于编程领域的一种哲学观念——一种看待事物的方式。那什么是对象呢？对象是一种对现实事物的抽象，对象由静态的属性和动态的行为组成。简单的例子是，狗是一个对..
2022-01-22 11:18:25
1208
原创 虎虎旋转木马--开心、浪漫，你值得拥有
目录前言一、2D转换--transform1、移动translate2、旋转rotate3、转换中心点4、缩放--scale5、2D转换综合写法二、动画1、动画基本使用2、动画常用属性3、动画简写属性4、速度曲线细节三、3D转换1、3D移动translate3d2、透视--perspective3、3D旋转4、3D呈现transfrom-style四、虎虎旋转木马效果展示总结前言今天给大家简单的分享一下关于H5C3的进阶..
2022-01-05 21:09:22
682
9
原创 一个简单的品优购项目----html+css
品优购的简单介绍本次的项目我们要结合html和css来实现品优购网上商城网站前台的部分页面。包括品优购网站首页、品优购商品列表页，商品详情页、品优购用户注册页和登录页，详情如下一、在本次项目使用到的相关小点1、精灵图为了有效减少服务器接收和发送请求的次数，提高页面的加载速度主要借助与背景位置实现--background-position，一般情况精灵图都是负值，x轴往右是正，左边是负值，右轴同理使用方法：把要使用的一张大的背景图放在一个新建项目里面的一个图片文件夹里，然后用bac..
2021-12-29 16:37:30
2386
16
原创 撑开一片天，划出一道云。欲求阴阳理，入我太极门----学的新知识，还数HTML5＋CSS3
前言今日分享两个HTML和css的升级---HTML5 和css3的一些新特性以及新标签的使用，内容如下：一、HTML5的介绍1、简介HTML5是构建Web内容的一种语言描述方式。HTML5是互联网的下一代标准，是构建以及呈现互联网内容的一种语言方式．被认为是互联网的核心技术之一。HTML产生于1990年，1997年HTML4成为互联网标准，并广泛应用于互联网应用的开发。HTML5是Web中核心语言HTML的规范，用户使用任何手段进行网页浏览时看到的内容原本都是HTML格式的，在浏览器中
2021-12-22 17:14:58
742
17
原创 留下美好瞬间，欣赏大千世界----- 摄影图片分享网站
前言随着人们的收入水平也越来越高，物质水平也相应的提升，大家都有更多的时间和收入去做一些自己喜欢的事情，摄影作为一门艺术受到了很多人的喜爱，照片也成为了人们分享生活，保存美好的一种方式 。一、项目前提--知识掌握点掌握HTML语义化标签； 掌握css基本语法； 掌握css选择器的使用； 掌握css盒子模型； 掌握css浮动；二、网站简介本网站开发包含首页、风景篇、美食篇、人物篇、联系我们等5大页面组成。每个页面都包含了导航栏、主要界面及底部联系信息。 每个人页面基本上都...
2021-12-14 10:49:15
1175
19
原创 CSS选择器及引入方式
目录前言一、css选择器1、基础选择器2、复合选择器二、css引入方式总结前言学习了一段时间了解了什么是CSS，我归纳出了我觉得在CSS中非常重要的四个知识点。首先就是：CSS选择器，，其次是：盒子模型，然后是引入方式，那么最后一个就是：浮动，首先让我们先来看看CSS选择器和引入方式！一、css选择器1、基础选择器 是单个选择器组成，包括标签选择器、类选择器、ID选择器和通配符选择器。 标签选择器：标签名{ 属性：属性值；}，用HTML标签作...
2021-12-09 14:56:33
1008
19
原创 带你了解CSS浮动的魅力
前言 目录前言 一、什么是浮动？二、浮动产生的影响（问题） 三、清除浮动--解决浮动带来的问题1、后续标准流被覆盖解决方案：给box2 添加如下代码：2、父级盒子高度塌陷问题解决方法3、垂直外边距重合 解决方法如下：总结 今天给大家分享浮动会带来的一些都会遇到的问题。一、什么是浮动？1、含义：浮动属性是float用于创建浮动框，将其移动到一边，直到左边缘或右边缘触及包含块...
2021-12-08 23:05:43
554
1
原创 关于春节的那些事（HTML的标签和链接）
前言随着计算机的不断发展，学习HTML这门技术也越来越重要，很多人都开启了学习，本文就介绍了学习HTML的基础内容。一、HTML是什么？超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。标记语言是一套标记标签(markup tag) HTML 使用标记标签来描述网页 HTML 文档包含了HTML标签及文本内容 HTML文档也叫做web 页面 HTML 实例: 1 2 3...
2021-12-02 10:54:07
1023
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人