
前端代码记录
文章平均质量分 61
Aiden-KH
keep calm and carry on.
展开
-
VUE自定义指令实现鼠标拖拽
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>练习:自定义指令 实现元素的拖拽</title> <script src="js/vue.js">&原创 2018-12-27 12:59:01 · 2059 阅读 · 0 评论 -
vue-8-1 项目结构的搭建与开发
一、 准备工作1. 初始化项目webpack模板已经配置好了webpack.config所以less less-loader不需要重新配置。vue init webpack itanycd itanycnpm installcnpm install less less-loader -Dcnpm install vuex axios -Snpm run dev2. 项...原创 2019-01-09 21:57:44 · 161 阅读 · 0 评论 -
vue-7-3 Vuex基本用法01
1. 简介项目简单不需要使用大型项目好用是要是为了解决多个组件要访问一样的数据的问题,进行集中的数据管理和状态管理Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。简单来说,用来集中管理数据,类似于React中的Redux,都是基于Flux的前端状态管理框架 ...原创 2019-01-08 16:13:55 · 205 阅读 · 0 评论 -
VUE-7-2 自定义全局组件(插件)
全局组件(插件):就是指可以在main.js中使用Vue.use()进行全局引入,然后在其他组件中就都可以使用了,如vue-router.element-UI import VueRouter from 'vue-router' Vue.use(VueRouter);普通组件(插件):每次使用时都要引入,如axios import axios from 'axios...原创 2019-01-08 13:07:33 · 310 阅读 · 0 评论 -
VUE-7-1 ElementUI
1. 简介Element UI是饿了么团队提供的一套基于Vue2.0的组件库,可以快速搭建网站,提高开发效率 ElementUI PC端 MintUI 移动端官网2. 快速上手2.1 安装elment uicnpm install element-ui -S2.2 在main.js中引入并使用组件import ElementUI from '...原创 2019-01-08 10:36:51 · 172 阅读 · 0 评论 -
VUE-6-4 VUE脚手架
1.简介vue-cli是一个vue脚手架,可以快速构造项目结构vue-cli本身集成了多种项目模板: simple 很少简单 webpack 包含ESLint代码规范检查和unit单元测试等 webpack-simple 没有代码规范检查和单元测试 browserify 使用的也比较多 browserify-simple2示例2.1安装vu...原创 2019-01-07 21:57:54 · 176 阅读 · 0 评论 -
vue-6-5 模块化开发
1.建立项目1.1初始化项目会自动建立项目文件其中webpack-simple是模板,另外一个常用的是webpackvue init webpack-simple demo1.2安装package.json里面的所有依赖模块cnpm install1.3项目下,命令行输入npm run dev可以看到demo页面2.模块安装和使用2.1vue-r...原创 2019-01-07 21:35:40 · 453 阅读 · 0 评论 -
原生JS、jQuery和VUE中的Ajax比较
Ajax:不刷新浏览器的情况下加载数据1.原生JS中的Ajaxfunction loadXMLDoc(){ var xmlhttp; if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 xmlhttp=new XMLHttpRequest(); } else {...原创 2019-01-02 21:23:29 · 1726 阅读 · 0 评论 -
VUE-6-3 单文件组件
1..vue文件.vue文件,称为单文件组件,是Vue.js自定义的一种文件格式,一个.vue文件就是一个单独的组件,在文件内封装了组件相关的代码:html、css、js.vue文件由三部分组成:<template>、<style>、<script> <template> html </template...原创 2019-01-03 21:12:37 · 421 阅读 · 0 评论 -
VUE+Boostrap实现简单的用户添加和删除
1.导入所需的库 css需要bootstrap.css js需要jquery.js,bootstrap.js,vue.js (直接使用下载好的就行,不需要使用npm等进行下载)2.使用boostrap实现界面 实现效果如下 代码实现如下:<body><div id="userList" class="co...原创 2018-12-23 21:10:32 · 1082 阅读 · 0 评论 -
根据出生日期计算当前年龄
要求:大于11岁:XX岁大于等于18个月且小于11岁:xx岁xx月小于18个月:xx月xx天提示:输入的是一个moment对象birthdayToAgeByYear(values){ let date = this.getValue(values[0]);//moment对象 let newAge=""; if(moment.isMoment(date...原创 2019-06-13 16:23:14 · 1511 阅读 · 0 评论