Vue父组件向子组件传递事件/调用事件 不是传递数据(props)哦,适用于 Vue 2.0 方法一:子组件监听父组件发送的方法 方法二:父组件调用子组件方法 子组件: export default {mounted: function () {this.$nextTick(function () {this.$on(childMethod, function () {console.log(监听成功)})})},methods {callMethod () {console.log(调用成功)}} }父组件: <child ref="child" @click="click"></child>export default {methods...
vue在同一个组件内; methods中的一个方法调用methods中的另外一个方法 可以在调用的时候 this.$options.methods.test2(); this.$options.methods.test2();一个方法调用另外一个方法; new Vue({ el: #app, data: { test:111, }, methods: { test1:function(){ alert(this.test) }, test2:function(){ alert("this is test2") alert(this.test) //test3调用时弹出undefined }, test3:function(){ this.$options.methods.test2();/...
有时候因为布局问题,需要子组件 把数据 传给父组件,并执行父级的某个方法,不多说上代码: 子组件: <template> <div class="isShowing" ref="isShowing"> <div class="menu-wrapper" ref="scroll_warpper" v-show="!hid_show_switch"> <ul ref="scroll_warpper_ul"> <li class="menu-item" @click="goToFatherDetail(233)"> </li> </ul> </div> <v-loading class="isloading" v-show="hid_show_switch"></v-loading> </div> </...
前言不知道用隐式调用来形容是否确切,其行为总是隐藏在背后,时不时出来露脸一下,作用貌似不大,但是了解一下还是有用处的,保不准在你的使用下大有作为。所谓的隐式调用简单来说就是自动调用一些方法,而这些方法像钩子一样可以在外部修改,从而改变既定行为。 下面我会列举一些最近看到的隐式调用,例子都是点到即止,欢迎补充 数据类型转换 toSting 和 valueOf var obj = {a: 1,toString: function () {console.log(toString)r...
有时候因为布局问题,需要子组件 把数据 传给父组件,并执行父级的某个方法,不多说上代码: 子组件: <template> <div class="isShowing" ref="isShowing"> <div class="menu-wrapper" ref="scroll_warpper" v-show="!hid_show_switch"> <ul ref="scroll_warpper_ul"> <li class="menu-item" @click="goToFatherDetail(233)"> </li> </ul> </div> <v-loading class="isloading" v-show="hid_show_switch"></v-loading> </div> </...
父级组件上的三个按钮可以 调用子组件loading的三个方法,执行不同的操作<!DOCTYPE html> <html> <head><meta charset="utf-8"><script src="vue.js" charset="utf-8"></script> </head> <body><div id="app"><loading ref=load></loading><button type="button" @click=show>显示</button><button type="button" @click=hide>隐藏</button><button type="button" @click=changeColor>变色</button></div> </body> <script type="t...
1.首先定义一个公共的vue组件; var eventHub = new Vue(); 2.在事件当前的组件中,在created中,用$on向公共的组件eventHub传递,translate是自定义的,getCardNum(data)是要在外部调用的方法; eventHub.$on(translate, function (data) { that.getCardNum(data); }); 3.最后在父组件中,注意负组件要用一个变量保存,var vm = new Vue({}); 4.在父组件中的methods的方法中定义一个方法,在方法里用$emit接收公共组件里的方法; ...
基础axios用法请看axios官网 //依赖于axios对私有ajax进行修改 import Qs from qs import axios from axios import router from router/index import {errorPrompt, loading, closeLoading} from util/util export const status = {SUCCESS: 100,NET_ERR: 101, // 网络连接异常,请稍候再试BIZ_ERR: 103, // 业务请求异常NO_AUTH: 104 } export function fetch(options) {return new Promise((resolve, reject) => {let instance =...
想必大家都用过或接触过 OkHttp,我最近在使用 Okhttp 时,就踩到一个坑,在这儿分享出来,以后大家遇到类似问题时就可以绕过去。 只是解决问题是不够的,本文将 侧重从源码角度分析下问题的根本,干货满满。 1.发现问题 在开发时,我通过构造 OkHttpClient 对象发起一次请求并加入队列,待服务端响应后,回调 Callback 接口触发 onResponse() 方法,然后在该方法中通过 Response 对象处理返回结果、实现业务逻辑。代码大致如下...
今天早上老大和我说之前项目里面的那个数据要改动,要对 mongodb 中每条记录进行 update 操作,你写个脚本跑一下吧。 然后,我默默的回到电脑前,努力工作的一天又开始了。由于此表数据量有点略大,该有一千多万条记录。所以考虑使用 mongodb 的 cursor 游标来进行遍历修改。 程序实现的代码大致如下 function modify(cursor) {cursor.hasNext(function(err,bool) {if(err) {return console.log(err); } if(bool) {cursor.next(fun...
在写一个文件上传的功能时候,调用fs.renameSync方法错误 出错 代码所在如下:function upload(response,request){console.log("upload called");var form = new formidable.IncomingForm();console.log("about to parse");form.parse(request, function(error, fields, files) {console.log("parsing done");fs.renameSync(files.upload.path, "./tmp/test.jpg");response.writeHead(200, {"Content-Type": "text/html"});respons...
前言 前几天在慕课网上看到黄轶老师的高仿饿了么app视频教程,在做接口设计的时候,我在想,这个接口能不能储存下来全局调用呢?而不是走很多次接口,管理起来也麻烦。万能的vue果然有这个功能,那就是vuex。Vuex 是一个主要应用在中大型单页应用的类似于 Flux 的数据管理架构。它主要帮我们更好地组织代码,以及把应用内的的状态保持在可维护、可理解的状态。 如果你不太理解 Vue.js 应用里的状态是什么意思的话,你可以想象一下你...
前言一开始接触到vue中的组件的时候,对于组件的理解还是不够充分的,最近在开发个人博客项目中,一开始就没准备使用一些现在比较流行的UI库(毕竟是个人项目,多练练手还是好的),所以需要自己开发几个全局组件,这里以MessageBox为例记录下vue.js如何开发全局组件。所谓全局变量是针对vue实例下说的,即所有的vue实际都可以运用到这个组件,局部组件就是针对某个实例来说的,只有这个vue实例下才能发挥作用,下面话不多说了,来...
前情回顾 在上一篇中,我们通过配置基本的信息,已经让我们的项目能够正常的跑起来了。但是,这里还没有涉及到 AJAX 请求接口的内容。 vue 本身是不支持 ajax 接口请求的,所以我们需要安装一个接口请求的 npm 包,来使我们的项目拥有这个功能。 这其实是一个重要的 unix 思想,就是一个工具只做好一件事情,你需要额外的功能的时候,则需要安装对应的软件来执行。如果你以前是一个 jquery 重度用户,那么可能理解这个思想一定要深...
在我最初开始写 JavaScript 函数时,通常是这样的: function fun1() {// some code here } function fun2() {// some other code here } ...函数全写在全局环境中,项目很小时,通常不会有什么冲突问题。 但代码多了后,渐渐就发现,函数名称(英文词汇)有点不够用了。于是引入命名空间的概念,开始模块化代码。 命名空间下的函数 在命名空间下,我的代码这样写:var com = com || {}; com.zfanw = com.zfanw || {}; com.zfanw.m...