有时候因为布局问题，需要子组件 把数据 传给父组件，并执行父级的某个方法，不多说上代码： 子组件： <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接收公共组件里的方法； ...
前言 前几天在慕课网上看到黄轶老师的高仿饿了么app视频教程，在做接口设计的时候，我在想，这个接口能不能储存下来全局调用呢？而不是走很多次接口，管理起来也麻烦。万能的vue果然有这个功能，那就是vuex。Vuex 是一个主要应用在中大型单页应用的类似于 Flux 的数据管理架构。它主要帮我们更好地组织代码，以及把应用内的的状态保持在可维护、可理解的状态。 如果你不太理解 Vue.js 应用里的状态是什么意思的话，你可以想象一下你...
前言一开始接触到vue中的组件的时候，对于组件的理解还是不够充分的，最近在开发个人博客项目中，一开始就没准备使用一些现在比较流行的UI库（毕竟是个人项目，多练练手还是好的），所以需要自己开发几个全局组件，这里以MessageBox为例记录下vue.js如何开发全局组件。所谓全局变量是针对vue实例下说的，即所有的vue实际都可以运用到这个组件，局部组件就是针对某个实例来说的，只有这个vue实例下才能发挥作用，下面话不多说了，来...
前情回顾 在上一篇中，我们通过配置基本的信息，已经让我们的项目能够正常的跑起来了。但是，这里还没有涉及到 AJAX 请求接口的内容。 vue 本身是不支持 ajax 接口请求的，所以我们需要安装一个接口请求的 npm 包，来使我们的项目拥有这个功能。 这其实是一个重要的 unix 思想，就是一个工具只做好一件事情，你需要额外的功能的时候，则需要安装对应的软件来执行。如果你以前是一个 jquery 重度用户，那么可能理解这个思想一定要深...
前言 今天同事问了一个问题，他在用iview开发时，需要用到iview一个组件的内部方法，而这个内部方法并没有暴露出来，这种情况下如何调用组件内部方法呢，其实很简单，举个栗子 示例代码 子组件： <template><div>child</div> </template><script>export default {name: "child",props: "someprops",methods: {parentHandleclick(e) {console.log(e)}}} </script>父组件: <template><div><button @click="clickParent">点击</button...
目前，项目中使用了纯前端的静态项目+RESTFul接口的模式。为了更好的对数据进行操作，前端使用了vue2的mvvm功能，但是由于不是单页面应用，所以，并没有涉及到其它的如vue-route等功能，也未使用webpack等编译功能，所以，也没有使用.vue文件功能。这时候，如果用到控件，则多数从原jquery的组件中选择。 select下拉搜索选择 这次的需求调研与设计是原来做winform开发的同事，由于用惯了devexpress这个控件库，所以，对于searchloo...
本文实例为大家分享了vue toast弹框全局调用示例，供大家参考，具体内容如下 1.首选新建一个toast.vue模板文件:<template><transition :name="fadeIn"><div class="alertBox" v-show="show"><div class="alert-mask" v-show="isShowMask"></div><transition :name="translate"><div class="box" :class="position" v-show="show">{{text}}</div></transition></div></transition> </template><script> export default {data() {ret...
1.先用node+express+mysql简单配置一下后台const express = require(express); const mysql = require(mysql); const static = require(express-static);const db = mysql.createPool({host: localhost,user: nodejs,password: nodejs,database:resume,port: 3306 });var app = express(); // ====》设置了一个 /resume 的接口，并将从数据库获取的数据data，send到前台（接口名字随便取的） app.use(/resume, (req, res)=>{db.que...
概述 上一篇我们介绍了如何使用vue resource处理HTTP请求，结合服务端的REST API，就能够很容易地构建一个增删查改应用。 这个应用始终遗留了一个问题，Web App在访问REST API时，没有经过任何认证，这使得服务端的REST API是不安全的，只要有人知道api地址，就可以调用API对服务端的资源进行修改和删除。 今天我们就来探讨一下如何结合Web API来限制资源的访问。 本文的主要内容如下： 介绍传统的Web应用和基于REST服务的Web应用介...
一. vue-amap，一个基于 Vue 2.x 和高德地图的地图组件 https://elemefe.github.io/vue-amap/#/ 这个就不细说了，按照其文档，就能够安装下来。 二. 按照官方提供的方法引入 1.修改webpac.base.conf.js文件externals: {AMap: AMap}2.引入sdk引入有两种方式，一种是页面直接引入代码如下: <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申请的key值"></script> 还有一种是异步加载 <script src="ht...
有时候因为布局问题，需要子组件 把数据 传给父组件，并执行父级的某个方法，本文主要介绍了Vuejs 2.0 子组件访问/调用父组件的方法(示例代码),需要的朋友可以参考下，希望能帮助到大家。不多说上代码：子组件：<template> <p class="isShowing" ref="isShowing"> <p class="menu-wrapper" ref="scroll_warpper" v-show="!hid_show_switch"> <ul ref="scroll_warpper_ul"> <li class="menu-item" @click="goToFatherDetail(233)"> ...
1. 创建可在 Window 和 Linux 上运行的跨平台桌面应用程序Electron-Vue 开发环境搭建 Demo 2. 创建 C# gRPC 服务教程：在 ASP.NET Core 中创建 gRPC 客户端和服务器 3. 更改 C# gRPC 服务使其支持 JavaScript 调用gRPC-Web 允许浏览器 JavaScript 应用调用 gRPC 服务。配置方法参考：配置 ASP.NET Core 中的 gRPC-Web 4. 为 C# gRPC 服务生成 JavaScript 代码通过 protoc and protoc-gen-grpc-web 插件根据 gRPC 定义，自动生...
1. 创建可在 Window 和 Linux 上运行的跨平台桌面应用程序Electron-Vue 开发环境搭建 Demo 2. 创建 C# Web API（RESTful 服务）C# 创建可跨域访问的 RESTful 服务（Web API） 参考：Electron-Vue axios 发送 Get 请求时报错 net::ERR_INSECURE_RESPONSE