- 博客(18)
- 收藏
- 关注
原创 五分钟上手Git教程
Git是什么?Git 是一个开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。 Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。 Git 与常用的版本控制工具 CVS, Subversion 等不同,它采用了分布式版本库的方式,不必服务器端软件支持。 Git 不仅仅是个版本控制系统,它也是个内容管理系统(CMS),工作管理系统等。Git安装配置教程:在使用Git前我们需要先安装 Git。Git 目前支持 Linu.
2021-11-04 09:23:42
301
原创 移动端适配
引言移动端适配一向是很令人头大的问题,因为随着移动设备型号数量的爆发式增长,手机屏幕尺寸越来越多样化,网页内容自适应屏幕尺寸进行显示的需求也就越来越强烈。原本可能通过百分比/媒体查询等简单手段就可以常见的适配问题,但是对于页面有复杂结构或者视觉上有特殊要求的,就需要通过其他手段来解决了。像素基础像素像素是一个老生常谈的问题了。不论是做前端开发还是做UI设计,都离不开这个话题。其实真要深究起来,像素是一个十分复杂的概念。追溯到上世纪6、70年代,计算机的输出设备还是点阵式打印机,如何使打印机打
2021-10-24 18:59:49
1519
原创 Vue劫持data
window上生成Vue 在用Rollup搭建开发环境时,用了format:"umd",的打包模式。umd的打包模式会在window上添加Vue节点。例如:在src/index.js中export default function Vue() { console.log('Vue节点');}rollup打完包后在html页面中引入生成的vue.js然后打印Vue<body> <div id="Vue">首页</div> ...
2021-10-12 20:40:38
337
原创 作品详情页(评论、收藏等功能)
功能流程概述:这li我分为三部头部和主体都是获取数据渲染数据还有一个收藏,主体有一个序号表示,底部就是我们的评论了,头部我们首先通过api获取数据,根据menuid请求数据(查看数据结构),渲染页面()如果没有meunid,提示框请登录),收藏按钮:判断是否本人登录在显示。主体:逐个渲染数据中,菜品的步骤,编号使用数据下标+即可(index)。评论:使用v-model实现响应,判断id获取数据渲染头部:根据数据,逐个渲染头部页面,用户信息通过,query传入用户id,跳转个人空间 收藏按钮:判
2021-10-12 20:02:41
581
原创 Vuex的响应式原理
状态管理在开发中,我们会用应用程序处理很多的数据,这些数据需要保存在我们应用程序徐的某一个位置,对于这些数据的管理我们就称之为状态管理使用方法下载vuex最新版npm install vuex@next 新建文件夹及文件 * index.js导入createStore ,并创建state共享数据import { createStore } from 'vuex'const store = createStore({ state() { return ...
2021-10-12 19:26:22
1622
原创 tab栏和侧边栏的效果和功能
tab栏和侧边栏的效果和功能,数据渲染都是运用了element-ui里的组件tab切换一级菜单低下对应的二级路由,点击子级的时候动态绑定class类名,当满足条件的时候点击的class类名更改,刷新的时候保存当前被选中的状态筛选也是由一级菜单对应子级的二级菜单,被选中的状态,刷新页面的时候保存状态tab渲染代码 <el-tabs v-model="classifyName" type="border-card"> <el-tab-...
2021-10-10 19:39:55
872
原创 掉接口实现是自己的还是其他用户及tap切换
效果实现概述: 显示别人的空间 地址栏中如果有userId,侧显示对用户的数据 如果没有userId,则默认显示自己的信息(Vuex) 如果菜谱中,点击自己,也是有userId传递的 通过判断是否为自己,如果是,不需要后端拿,登录时,个人信息已经存在了vuex中 关注后,需要新的数据里,还有粉丝,所以整体赋值 监听路由变化,来判断路由是否有信息,从而分辨是否为自己的空间 代码实现思路:用axios进行二次封装,那利用了就调用他的借口.
2021-10-08 20:19:29
221
原创 移动端基础知识
基础 移动端游览器我们只要对webkit内核进行兼容 现在移动端碎片化比较严重,分辨率和屏幕尺寸大小不一视口 视口(viewport)就是游览器显示页面内容的屏幕区域。视口可以分为布局视口,视觉视口和理想视口 布局视口 layout viewport 一般移动设备的浏览器都默认一个布局视口 视觉视口,字面意思,它是用户看到的网站的区域 理想视口 ideal viewport 对设备来讲,是最理想的视口尺寸,需要手动添加meta视口标签通知游览器操作 ...
2021-10-07 19:40:25
178
原创 回流和重绘
构建 frame, 以建立DOM树。 回流(reflow) 引起Dom树结构变化,改变页面布局。 重绘(repaint) 不会引起Dom树变化及页面布局变化,只重新渲染页面样式回流(Reflow)和重绘(Repaint)重绘是当节点需要更改外观而不会影响布局,比如改变color就称为重绘。 回流是布局或者集合属性需要改变就称为回流。回流必定会发生重绘,重绘不一定会引发回流。回流所需要的成本你重回高的多,改变深层次的节点很可能导致父节点的一系列回流。所以以下几个动作可能会导致性能问题:.
2021-10-07 18:57:02
834
原创 Vue实现CNode
效果实现思路及过程:通过vuex调用CNdoe接口, 通过Tap切换来实现跳转 通过dayjs插件是现实事件 获取屏幕可视区实现回到顶部效果代码实现:vuex代码实现思路:我们通过async和await异步获取数据,然后进行赋值,接口文档https://cnodejs.org/apiimport Vue from 'vue'import Vuex from 'vuex'import axios from 'axios'Vue.use(Vuex)export defau.
2021-10-07 00:02:14
573
原创 Vue增删改查(Todo-list进阶版)
效果实现流程:首先创建一个vue项目,Todo-list总共分三步来写, 头部我们使用input框来实现输入的数据,使用键盘事件点击添加到数据中,使用v-model实现响应式数据, 第二步来进行筛选,是完成还是未完成 我们添加的数据在这里拿到进行渲染,然后我们用css3的属性实现删除的显示和隐藏代码实现思路:vuex代码实现思路:我们在vuex中创建一个空对象,在定义一个初始值和初始状态,当我们的全部,然后在用map循环通过id来判断他的状态,是true还是false,实现单选和全选.
2021-10-06 20:47:32
804
1
原创 Vue购物车(购物车进阶版)
效果流程我们在vue项目中views中创建两个组件一个购物页,一个购物车 我们通过localStorage本地储存,来实现页面刷新不掉 使用Vuex来进行传值 使用Tap来实现切换和是筛选 给我们加入购物画册女页的数据添加状态,判断是否选中 通过状态来判断选中删除代码实现流程Vuex代码逻辑实现:首先在vuex中通过localStoage来拿取本地数据,先创建一个空对象,来存放拿取的数据,在创建一个来访,我们添加购物车的数据,在创意两个空数组来存放我们的总价和总数量import
2021-10-05 21:03:03
1613
原创 Vue增删改查(Todo-list简易版)
首先了解一下实现流程 首选我们创建一个vue项目,然后通过vuex来存放我们的数据,再定一个初始状态,当我们添加的是时候就加入到我们在vux中定义的空对象,通过id进行删除,通过状态进行筛选效果实现及思路1.我们在vue项目中定义个空数据,使用v-model来是双向数据响应,存放我们输入的数据进行赋值,给到我们vuex的空对象中,这里是home页<template> <div> <h1>todolist</h1&...
2021-10-03 16:22:13
765
原创 Vue购物车(购物车简易版)
首先了解一下效果实现流程 1. 首先我们在views中创建两个vue项目,(商品页和购物车页) 2.在我们商品页拿到我们的数据进行渲染,给每个商品加入一个点击事件,当点击加入购物车页 3.在购物车页来计算商品的综合加钱,单个的加减功能的实现商品页实现流程我们通过本地储存localStorage存储到本地,然后在我们Vue项目中的store中创建一个空的对象,来放置我们存在本地的数据,我们在商品页拿取我们vuex中...
2021-10-03 15:09:04
673
原创 30道Vue高频面试题
1.vue的生命周期及作用,适合用在那个地方?在vue生命周期的不同阶段通过对应的钩子函数来实现组件数据管理和DOM渲染两大重要功能。创建阶段:beforecreate:实例已经初始化,但不能获取DOM节点。(没有data,没有el)created:实例已经创建,仍然不能获取DOM节点。(有data,没有el)载入阶段:beforemount:模板编译完成,但还没挂载到界面上。(有data,有el)mo...
2021-09-27 15:52:28
1135
1
原创 javascript小游戏贪吃蛇实现思路讲解(完整代码实现)
效果流程首先我们要操作的canvas <!doctype html><html><head><meta charset="utf-8"><title>贪吃蛇</title></head><body> <canvas id="canvas"></canvas> <!-- 我们要操作的canvas --> <input type="button"
2021-09-25 19:49:04
1605
1
原创 Vue实现快速简洁的轮播图
系列文章目录提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加例如:第一章 Python 机器学习入门之pandas的使用提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录系列文章目录 前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基
2021-09-25 18:26:31
446
原创 Vue实现登录以及登出
首先先了解一下,我们的效果实现流程 首先登录概述及业务流程和相关技术点 1.登录页面的布局2.创建两个Vue.js文件3.一个我们来做登录页和注册页4.登录页面的布局5.配置路由6.登录表单的数据绑定7.登录表单的验证规则...
2021-09-23 20:40:00
1556
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人