文章分类 -  vue

vue学习
解决npm install安装慢的问题
摘要：原因: 国外镜像会很慢 一般会切换为国内 1.使用get命令 查看registry npm config get registry 初始地址为 : http://registry.npmjs.org 2.使用set命令切换成阿里镜像 npm config set registry https://r 阅读全文
posted @ 2020-09-09 16:27 野香蕉 阅读(829) 评论(0) 推荐(0)
CRUD 增删改查
摘要：查询 <html> <head> <script src="https://how2j.cn/study/js/jquery/2.0.0/jquery.min.js"></script> <script src="https://how2j.cn/study/vue.min.js"></script 阅读全文
posted @ 2020-09-07 17:43 野香蕉 阅读(75) 评论(0) 推荐(0)
vue-cli
摘要：什么是 vue-cli 呢？vue-cli 是 vue 出来的一个脚手架，可以进行 组件式地开发。但是要运用 vue-cli , 必须要有 node.js 和 webpack 的基础，否则里面很多命令既运行不了，也无法理解。 1.准备项目目录 E:\project\vue-cli 2.安装 vue- 阅读全文
posted @ 2020-09-07 17:40 野香蕉 阅读(61) 评论(0) 推荐(0)
ajax
摘要：Vue.js 并没有限制使用哪种方式进行 ajax 访问，所以可以使用如下方式1. 原生 ajax2. JQuery3. vue-resource4. fetch.js5. axios.js那么到底用哪种方式呢？1. 原生一般不在项目中直接用2. jquery 不如4，5方便3. vue-resou 阅读全文
posted @ 2020-09-07 17:33 野香蕉 阅读(81) 评论(0) 推荐(0)
ajax 使用axios.js
摘要：<script src="https://how2j.cn/study/axios.min.js"></script> <div id="hero"> </div> <script> var url = "http://how2j.cn/study/json.txt" axios.get(url). 阅读全文
posted @ 2020-09-07 17:31 野香蕉 阅读(197) 评论(0) 推荐(0)
ajax 使用fetch.js
摘要：一般说来 Vue 不会直接使用原生的 Ajax 而是使用 ajax 框架。 而 fetch.js 就是眼下比较流行的一种 ajax 框架 <script src="https://how2j.cn/study/fetch.min.js"></script> <div id="hero"> </div 阅读全文
posted @ 2020-09-07 17:29 野香蕉 阅读(390) 评论(0) 推荐(1)
路由
摘要：vue-router.min.js <script src="http://how2j.cn/study/vue-router.min.js"></script> <script src="https://how2j.cn/study/vue.min.js"></script> <script sr 阅读全文
posted @ 2020-09-07 17:18 野香蕉 阅读(67) 评论(0) 推荐(0)
自定义指令
摘要：像 v-if, v-bind, v-on 等等前面学习的指令，都是 vus.js 自带的指令，那么除了这些指令，开发者还可以开发自定义的指令，比如 v-xart 来做一些效果。 自定义指令的方式：1. 使用Vue.directive 来自定义2. 第一个参数就是 指令名称 xart3. el 表示当 阅读全文
posted @ 2020-09-07 17:16 野香蕉 阅读(1942) 评论(0) 推荐(0)
组件
摘要：组件就是一个模板 在 Vue对象里增加 components： <script src="https://how2j.cn/study/vue.min.js"></script> <style> div.product{ float:left; border:1px solid lightGray; 阅读全文
posted @ 2020-09-07 16:56 野香蕉 阅读(80) 评论(0) 推荐(0)
过滤器
摘要：一个过滤器 首字母大写的过滤器 <script src="https://how2j.cn/study/vue.min.js"></script> <style> table tr td{ border:1px solid gray; padding:10px; } table{ border-co 阅读全文
posted @ 2020-09-07 16:23 野香蕉 阅读(78) 评论(0) 推荐(0)
监听属性
摘要：watch vue可以通过watch来监听属性值的变化。 <script src="https://how2j.cn/study/vue.min.js"></script> <style> table tr td{ border:1px solid gray; padding:10px; } tab 阅读全文
posted @ 2020-09-07 16:17 野香蕉 阅读(161) 评论(0) 推荐(0)
计算属性
摘要：直接运算 <script src="https://how2j.cn/study/vue.min.js"></script> <style> table tr td{ border:1px solid gray; padding:10px; } table{ border-collapse:coll 阅读全文
posted @ 2020-09-07 16:10 野香蕉 阅读(67) 评论(0) 推荐(0)
vue 绑定事件
摘要：v-bind:href="" <a v-bind:href="page">http://12306.com</a> <script src="https://how2j.cn/study/vue.min.js"></script> <div id="div1"> <a v-bind:href="pa 阅读全文
posted @ 2020-09-07 15:59 野香蕉 阅读(159) 评论(0) 推荐(0)
vue 循环
摘要：<script src="https://how2j.cn/study/vue.min.js"></script> <style> table tr td{ border:1px solid gray; } table{ border-collapse:collapse; width:300px; 阅读全文
posted @ 2020-09-07 15:37 野香蕉 阅读(66) 评论(0) 推荐(0)
vue 监听事件
摘要：v-on 监听 <script src="https://how2j.cn/study/vue.min.js"></script> <div id="div1"> <div>一共点击了 {{clickNumber}}次</div> <button v-on:click="count">点击</but 阅读全文
posted @ 2020-08-28 16:24 野香蕉 阅读(3381) 评论(0) 推荐(0)