- 博客(45)
- 收藏
- 关注
RSS订阅原创 Vue键盘事件keyup、keydown
可以指定某个按键触发，例如制定输入内容后，按enter键触发，代码：<input type="text" v-on:keydown.enter="logName">，也可以同时按多个键触发，例如按alt+enter触发：<input type="text" v-on:keyup.alt.enter="logAge">用法比较简单，直接跟在v-on后面使用，示例：<input type="text" v-on:keydown="logName">,当有键盘按键按下时调用logName()函数。
2023-11-09 18:19:56
1161
原创 定制相机在Android中使用
相机几乎是每个APP都要用到的功能，万一老板让你定制相机方不方？反正我是有点方。关于相机的两天奋斗总结免费送给你。创建显示相机画面的布局，Android已经为我们选定好SurfaceView通过SurfaceView#getHolder()获得链接Camera和SurfaceView的SurfaceHolderCamame.open()打开相机通过SurfaceHolder链接Camera和SurfaceView。
2023-11-09 16:29:24
178
原创 常见的移动端H5页面开发遇到的问题解决
有时扫描二维码后会跳转至某个地址,不幸的话QQ或者微信会对这个地址进行温馨提醒,这样会阻止部分用户继续访问,从而无法很好的将用户引导到活动想要推广的产品/品牌页面,如App的下载页面等,因此二维码的扫描测试不能少;举例:如果二维码扫描结果是应用的下载地址的,可以使用应用宝的微下载地址生成二维码,这就不会被"温馨提醒"了。2.生成BFC元素的子元素中每个子元素的外边距和包含块的左边界相接触(对于从右到左的格式化,右外边距和右边界相接触),除非这个子元素也创建一个新的BFC(如它自身也是一个浮动元素)
2023-11-09 16:27:22
824
原创 七个你可能不了解的CSS单位
随着Web继续的发展，对新的解决方案的需求也会继续增大。因此，作为网页设计师和前端开发人员，我们别无选择，只有去了解我们的工具集并且熟悉它。这意味着我们还要了解一些特殊的工具-那些不经常使用的，但是当需要它们的时候，它们恰恰是最正确的工具。今天，我将要向你介绍一些你以前可能不知道的CSS工具。这些工具都是计量单位。
2023-11-09 16:23:10
27
原创 经常使用的vue前端UI框架框架
所以不需要 jQuery 和 Bootstrap 的 JavaScript 文件，唯一需要依赖的是: Vue.js (要求版本为 ^0.12，基于 0.12.10 版本做的测试) Bootstrap CSS (需要版本为 3.x.x， 基于 3.3.5 版本做的测试)。vuetify(start-11449) 一个为 Vue JS 2.0 打造的 Material 风格的组件库,喜欢material design的朋友可以去尝试一下 官网地址。滴滴团队开发的一套基于 Vue.js 实现的精致移动端组件库。
2023-11-09 16:20:42
95
原创 前端知识库：包含所有你会用得到和需要的官方和超全的总结
强大的前端 MVC 库，鼻祖级前端库，最初为了配合 Rails 来模块化前端应用，兼容性良好 (兼容到 IE6)，插件丰富，性能良好。: 高性能的滚动(scroll)处理库，功能强大，支持各种事件，不依赖任何的库，且插件丰富, 大众点评的手机端列表滚动就是用这个库处理的。: 一个可以检测设备类型的工具，可以让我们根据不同的设备来为其定制响应的 Javascript 和 CSS。: 非常轻量级的一个图片滑动切换效果库, 性能良好, 尤其是对手机的支持, 压缩后的大小约 5kb。
2023-11-09 16:13:50
122
原创 案例：待办事项添加及勾选（vue2语法使用的总结案例）
button @click='add' >添加</button>：在页面中设置待办事项添加按钮及输入框，点击按钮添加代办事项 勾选完成待办事项。//输入框 v-model 数据同步。用这样的方法可以总结使用所有的模板语法 和语法糖。//添加按钮 v-on的简写@项目启动后npm run server。在App.vue文件中编写代码。
2023-11-09 00:57:43
95
原创 浏览器面面观 | Microsoft Edge 浏览器下 DNS_PROBE_FINISHED_BAD_SECURE_CONFIG 错误码的解决方法
我们可能经常在访问浏览器的时候会出现很多问题 最为典型的问题如下Microsoft Edge 浏览器访问任何页面都提示找不到 xxx 的服务器 IP 地址，但其他软件（比如 QQ）都可以正常使用、且检查过本地的 DNS 设置并无任何问题。这表示出错的是而本地 DNS，所以我们检查本地 DNS 当然找不到哪里出了问题啦！浏览器会提示我们错误问题如何解决问题。
2023-11-07 23:33:57
1528
原创 webpack（三、加载器）
在实际开发中，webpack只能打包处理以.js为后缀的模块（并且是其中一部分比较简单的JavaScript代码），其他非.js后缀的模块webpack默认处理不了，而需要调用loader加载器才能正常打包，否则会报错！loader加载器可以协助webpack打包处理特定的文件模块了，例如：less-loader可以打包处理.less相关的文件sass-loader可以打包处理.scss相关的文件...
2023-11-05 17:54:34
250
原创 webpack的配置文件（二、基本配置）
在vue中，我们并不是每次改完代码都打包看效果，而是在开发过程中有一个测试服务器，自动帮我们产生预览效果，但是并会真的去打包，只有等上线的时候我们才去打包。我们在第一节的概述中提及了webpack的五个核心概念，这五个核心概念都属于webpack的配置，因此，如果需要更好的运用webpack，我们需要掌握其配置文件的相关知识点。通过上一节，我们已经可以使用打包工具去将写好的代码进行打包了，但是在操作的过程中大家可能会发现有一个比较麻烦的地方：修改一次代码就得重新打包一次，这种感觉有点类似于之前的。
2023-11-05 17:52:49
389
原创 Webpack的认识及基本使用（一、核心概念及基本使用）
webpackwebpack是一种前端资源构建（打包）工具（npm run build），一个静态模块打包器。在webpack看来，前端的所有资源文件（js/json/css/image/less/sass...）都会作为模块处理。它将根据模块的依赖关系进行静态分析，打包生成对应的静态资源。webpack可以解决当前web开发中所面临的困境，webpack提供了：友好的模块化支持代码压缩混淆处理js兼容问题性能优化 treesharking。
2023-11-05 17:50:47
46
原创 nvm的认识及安装
nvm是一款nodejs版本管理工具。通过它可以方便下载和管理node多个版本。特别适合在需要不同nodejs环境下，进行切换。可以在全局或者不同目录[项目包]下切换不同的node版本。10,12,14。
2023-11-05 17:47:12
48
原创 UNIAPP框架及项目包的生成
使用基于React语法框架进行开发小程序，可以使用JD开源的是一个使用开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。
2023-11-04 17:56:37
136
原创 微信小程序（八、导航方式-基于组件和基于api）
小程序的路由章节并不是需要学习怎么定义路由，因为路由已经在app.json全局配置文件中声明好了。page的切换小程序提供了两种实现方式，一种是通过组件来实现，另外一种是通过api实现。小程序由于把页面进行了分类，不同类型的页面导航方式存在差异，因此此处我们至少需要创建三个页面。tabBar页面：2个非tabBar页面：1个跳转方式主要分为两种情况：任意页面 → 非tabBar页面任意页面 → tabBar页面。
2023-11-04 17:48:47
141
原创 微信小程序（七、常用小程序组件及自定义封装组件）
可以像在Vue和React中一样，将可复用的部分使用组件进行封装，可以通过模板标签进行调用。自定义组件 | 微信开放文档①建立components文件并创建一个组件②根据需要进行文件划分">/*** 组件的属性列表* 接收父传子的参数信息*/// 父传子props的类型限定data:{type:Array},/*** 组件的初始数据*/data: {},/*** 组件的方法列表*/methods: {})。
2023-11-04 17:46:13
154
原创 微信小程序（五、生命周期和页面事件处理）
app.js onLanch onShow onHide 当应用加载时、显示时、隐藏时pages/xxx.js onLoad onShow onReady onUnload 当页面加载、显示、挂载渲染完毕、卸载。
2023-11-04 17:10:13
156
原创 微信小程序（四、tabBar底部菜单栏）
微信小程序默认提供了，底部导航菜单栏的配置方式。使用app.json配置tabBar实现即可。"text": "首页","text": "列表",3、切换到的页面是tab页面，才可以显示出底部导航菜单。1、tabbar路径的page页面必须路径正确存在。2、显示选中和未选中的图片路径正确存在。
2023-11-04 17:09:26
524
原创 微信小程序（三、wxss样式）
在page的wxss文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖app.wxss中相同的选择器。WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式。WXSS在底层支持新的尺寸单位rpx，可以根据屏幕宽度进行自适应，响应式尺寸单位。同时为了更适合开发微信小程序，WXSS 对 CSS 进行了扩充以及修改。定义在app.wxss中的样式为全局样式，作用于每一个页面。WXSS 用来决定 WXML 的组件应该怎么显示。提供了全局的样式和局部样式。
2023-11-04 17:08:36
137
原创 组件通信（父传子，子传夫 ref 兄弟组件）
在MVVM框架中，每个组件的数据都具有，即默认情况下，组件自身的数据只允许在本组件内部供自己使用。但实际开发中，我们经常会需要将某些组件的数据对其它组件开放访问，此时就需要使用合适的通信方式来实现数据共享了，Vue框架中支持以下数据通信方式：父传子子传父兄弟通信非常深的层级的父子/子父关系等特殊关系 跨层级。
2023-11-03 15:06:16
190
原创 vue进行网络请求的基础语法，拦截器 取消网络请求
在开发中还是经常容易遇到的，一般在离开组件的时候可能需要做网络请求的取消操作。// axios.get(不带问号参数的地址,{params: {参数名:值,...}}).then(res => {})不管是请求拦截器还是响应拦截器，主要的好处体现在后续项目的封装中，到时候我们会对axios进行封装，这样一来，拦截器就成了全局的拦截器了。axios.get(可带问号参数的请求地址).then(res => {})// axios的get参数支持与请求地址分离，因此下面的语法也是可以的。
2023-11-03 15:04:02
184
原创 vue组件的生命周期
在生命周期的这个范围内，作者将其4个重要阶段，同时作者为了方便开发者指定组件在特定时间做一些特定的操作，对外暴露了一些特定名称的函数，这些函数我们称之为生命周期钩子函数。阶段（如果强制执行该阶段周期，可以this.$forceUpdate()）阶段（如果期望手动效果组件，可以执行this.$destroy()）生命周期：指的是Vue组件自其开始创建到其被销毁完毕这段时间范围。本节我们将依据其四个阶段，来学习其中最常见的8个周期函数。父1 父2 父3 父4 冰箱。子1 子2 子3 子4 大象。
2023-11-03 15:02:51
26
原创 vue的组件注册使用及常用属性
但指令的处理程序在编写的时候允许模块化，也建议采用模块化来保持入口文件中的代码可读性。Vue.directive("不带v-的指令名",包含指令处理程序的对象)
2023-11-03 15:01:52
176
原创 Vue模板语法
插值表达式：是vue框架提供的一种在HTML模板中绑定数据的方式，使用方式绑定Vue实例中data中的数据变量，会将绑定的数据实时的在视图中显示出来。插值表达式的写法支持使用：变量名部分JavaScript表达式注：括起来的区域，就是一个就是js语法区域，在里面可以写部份的js语法。不能写 var a = 10;分支语句;循环语句三元运算符方法调用（方法必须需要先声明）...<body> <div id="app"> <!-- 直接使用变量名 --&g
2023-11-03 15:00:10
154
原创 vue devtools工具安装
通过chrome中的谷歌插件商店安装Vue Devtools工具，此工具帮助我们进行vue数据调试所用，一定要安装。如果实在解决不了科学上网难题，Vue官方也提供了插件源码允许我们自己编译/构建Google Chrom插件，步骤如下（构建插件流程稍微麻烦一些<才能访问到，至于怎么科学上网请各位自行解决。>，此处已为同学们构建好，可以直接使用）。请注意：打开chrome应用商店，安装好后打开Chrome的。
2023-11-03 14:20:19
61
原创 vue-cli创建的项目包的基本认识（下）
想要快速实现一个页面 通过快捷方式 使用插件 vb快速生成结构（注意：注释必须写在标签内部，如果写在外部报错）.browserslistrc 在不同前端工具之前公用目标浏览器和node版本的配置文件。public中 index.html中有一个渲染容器（代表里面的代码渲染到这里）区别每一个项目包中需要到的依赖的内容通过 package.json文件。babel .config.js 兼容性的配置文件。配置文件vue.config.js 端口的设置。不同的浏览器有不同的解析代码的解析方式。
2023-11-02 18:45:24
25
1
原创 vueRouter（下）
例如：// 404路由问题：正常情况下404找不到会有状态码，是404，请问，为什么我们现在看到的状态码是200？答：目前是在做前端开发，不是后端开发，无法指定返回的状态码，等到vue项目上线后可以与后端服务器结合实现状态码的指定。
2023-11-01 11:50:16
57
1
原创 vueRouter（中）
Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由（套娃，父子路由）模块化的、基于组件的路由配置路由参数、查询、通配符带有自动激活（默认选中效果）的 CSS class 的链接HTML5 历史模式或 hash 模式MVVM框架采用的路由都会在地址改变的时候页面不刷新，这种应用我们称之为SPA（Single Page Application）
2023-11-01 11:49:42
56
1
原创 路由的概念,前端路由的实现和vueRouter的使用（上）
有带#号，后面就是hash值的变化。window.addEventListener('hashchange', ()=>{ // 通过 location.hash 获取到最新的 hash 值 console.log(location.hash);（此处的路由含义同之前nodejs的路由），根据不同的URL请求，返回对应不同的资源。那么url地址和真实的资源之间就有一种对应的关系，就是路由。概念：根据不同的用户URL请求，返回不同的内容（概念：根据不同的用户事件，显示不同的页面内容（
2023-11-01 10:39:02
53
1
原创 Vuex的认识
一般情况下，只有组件之间共享的数据才有必要存储到vuex中，对于组件中私有的数据依旧存储在组件自身的data中即可。一般情况下，只有组件之间共享的数据才有必要存储到vuex中，对于组件中私有的数据依旧存储在组件自身的data中即可。vuex是一种项目中数据共享的方式。mutations：修改state数据的方法，存放用于修改state数据的方法。actions：修改state数据的方法，存放用于修改state数据的方法。state：状态，用于初始化仓库中的数据，在这里声明项目中全局使用的数据。
2023-10-31 20:49:08
32
1
原创 vue-cli工程化脚手架搭建后的目录及项目运行注意事项（中）
进入创建的文件夹中会看到如上目录public：不需要去改动现有的文件，里面存放的是浏览器访问的入口文件（index.html）src（main.js：项目/程序入口文件 （该文件中JavaScript代码都会被执行）App.vue：根组件（万物之根）功能assets：静态资源目录（图片、视频、音频等就是静态资源），这里面的静态资源浏览器是无法直接访问的，而是给组件通过模块化的方式导入进组件使用的。项目中的静态资源有2个地方可以放。
2023-10-31 20:28:34
94
1
原创 vue2的使用和vue-cli脚手架的搭建（上）
组件 （Component）是 Vue.js 最强大的功能之一，组件是一个自定义HTML元素（标签）或称为一个模块，包括所需的模板（HTML）、逻辑（JavaScript）和样式（CSS）。标准分治重用组合组件也是有全局（component）与局部（components）之分。
2023-10-31 18:48:41
145
1
原创 vue的基本知识
作者：尤雨溪Vue.js是一套构建用户界面的框架。渐进式：循序渐进，不需要掌握全部的点，学多少用多少框架：半成品的应用（之前学习的jQuery也是一个框架）式渲染：（如同js基础一样，要使用变量则必须先声明变量，这种称之为声明式）Vue.js的核心是一个允许采用简洁的模板语法来声明式的将数据渲染进DOM的系统。应用构建组件系统是Vue的另一个重要概念，因为它是一种抽象的允许我们使用和通常的“小积木”构建大型应用。几乎任意类型的应用界面都可以抽象为一个组件树。基于。
2023-10-30 15:16:54
20
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人