JavaScript - 教程之家

365浏览

0评论

解决vue组件中click事件失效的问题

最近使用vue学习开发移动端的项目，使用了bette-scroll插件做滚动。在引入better-scroll的组件中使用@click事件的时候，点击事件失效，v-on:click、v-bind:click、@click.native...

2020-05-27

381浏览

0评论

解决vue 子组件修改父组件传来的props值报错问题

vue不推荐直接在子组件中修改父组件传来的props的值，会报错[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent compone...

2020-05-27

114浏览

0评论

vue-resource:jsonp请求百度搜索的接口示例

1. yarn add vue-resource2. main.js引入vue-resourceimport Vue from 'vue'import MintUI from 'mint-ui'import 'mint-ui/lib/style.css'import App from './App.vue'impo...

2020-05-27

195浏览

0评论

在vue中动态添加class类进行显示隐藏实例

如下所示：<div class="status_button"> <el-button type="success" @click="checkSite" >查岗</el-button> <el-button type="danger">视频</el-button> </d...

2020-05-27

152浏览

0评论

vue 根据选择条件显示指定参数的例子

html部分<el-select style="width: 200px;margin-left:5px;" v-model="queryType" slot="prepend" class="filter-item" @change="changepara"> <el-option v-for="(ite...

2020-05-27

146浏览

0评论

Vue通过for循环随机生成不同的颜色或随机数的实例

需求：随机生成不同的如下图标的背景颜色方法：本来通过计算属性渲染出随机颜色，然而计算属性是一次性获取值，即使你把RandomColor引入v-for中也没有用，得到的只会永远是同一颜色，除...

2020-05-27

93浏览

0评论

vue 实现特定条件下绑定事件

今天写了个小功能，看起来挺简单，写的过程中发现了些坑。1.div没有disabled的属性，所以得写成button2.disabled在data时，默认是true，使得初始化时，默认置灰按钮，无法点击<div class=...

2020-05-27

84浏览

0评论

Vue实现页面添加水印功能

创建watermark.js文件let watermark = {}let setWatermark = (str) => { let id = '1.23452384164.123412416'; if (document.getElementById(id) !== null) { document.bod...

2020-05-27

246浏览

0评论

Vue v-for循环之@click点击事件获取元素示例

应用背景浏览论坛的贴子（数据库的数据通过vue遍历在html页面上）点击帖子的标题、图片，可以查看详细的帖子（点击事件获取id）1、设置一个隐藏值的放置Id的div，点击div就获取id，传参到...

2020-05-27

240浏览

0评论

vue 取出v-for循环中的index值实例

一开始接触到vue的for循环就觉得贼好用，重复性的东西再也不用ctrl C+ctrl V了好吗。不仅代码可复用了，而且提高了代码可读性、减轻了工作量，更重要的是写代码都有成就感了。贴...

2020-05-27

78浏览

0评论

js实现的在本地预览图片功能示例

本文实例讲述了js实现的在本地预览图片功能。分享给大家供大家参考，具体如下：移动web<body><form enctype="multipart/form-data" name="form1">上传文件：<input id="f" type="...

2020-05-27

106浏览

0评论

JS+html5实现异步上传图片显示上传文件进度条功能示例

本文实例讲述了JS+html5实现异步上传图片显示上传文件进度条功能。分享给大家供大家参考，具体如下：<html> <head> </head> <body> <p> emo_album_id:<input type="te...

2020-05-27

81浏览

0评论

JS实现的进制转换，浮点数相加，数字判断操作示例

本文实例讲述了JS实现的进制转换，浮点数相加，数字判断操作。分享给大家供大家参考，具体如下：<script>document.write("整数转换函数：parseInt(数据,底数)<br>");document.write("...

2020-05-27

423浏览

0评论

Vue实现点击按钮复制文本内容的例子

点击复制功能主要通过 clipboard.js 来实现在vue中使用clipboard.js 时候发现一个问题，就是如果不是input或者button 按钮的话，则复制不成功，使用步骤如下：1、引入clipboard.js，...

2020-05-27

107浏览

0评论

Vue 实现复制功能,不需要任何结构内容直接复制方式

介绍：在做复制文档功能时，考虑到是个不太会复用的小功能，最后选择直接用 document.execCommand 方法实现。在查阅资料时候，发现其他人都需要在页面上写上结构、ID。然后捕捉某个...

2020-05-27

363浏览

0评论

vue实现页面内容禁止选中功能,仅输入框和文本域可选

上网上翻了翻，共找到两种方式CSS样式控制，只需将下面代码复制到 vue应用下，index.html文件中的body标签上*{ -webkit-touch-callout:none; /*系统默认菜单被禁用*/ -webkit-u...

2020-05-27

237浏览

0评论

使用Vue.set()方法实现响应式修改数组数据步骤

在页面中显示数组数据时发现了一个问题，当在methods方法中修改数组数据后，虽然数组已经发生改变，但是改变后的数据并没有渲染到页面上。这是因为在VUE中，如果在实例创建之后添加...

2020-05-27

86浏览

0评论

Vue 数组和对象更新,但是页面没有刷新的解决方式

在使用数组的时候，数组内部数据发生改变，但是与数组绑定的页面的数据却没有发生变化。<ul> <li v-for="(item,index) in todos" :key="index">{{item.name}}</li> </ul>data...

2020-05-27

165浏览

0评论

vue $set 给数据赋值的实例

如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。业务介绍：模拟后台数据向DOM树上遍历数据，再向数据里添加状态属性，根据状态改变显示图片，默认nochecked.png，点击时...

2020-05-27

119浏览

0评论

vue-父子组件和ref实例详解

父组件向子组件传值<div id="app"> <!-- 父组件，可以在引用子组件的时候，通过属性绑定（v-bind:）的形式, 把需要传递给子组件的数据，以属性绑定的形式，传递到子组件内部，供子...

2020-05-27

91浏览

0评论

分享Angular http interceptors 拦截器使用(推荐)

AngularJS 简介AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。AngularJS 通过指令扩展了 HTML，且通过表达式绑定数据到 HTML。拦截器在开...

2020-05-27

77浏览

0评论

vue父子组件的通信方法(实例详解)

一、父组件向子组件传递数据1、首先形成父子组件关系 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script src="../js/vue.js...

2020-05-27

84浏览

0评论

vue动态循环出的多个select出现过的变为disabled(实例代码)

vue动态循环出的多个select出现过的变为disabled<template> <div class="artcle"> <el-form label-width="100px" :model="testForm"> <el-form-item v-for...

2020-05-27

92浏览

0评论

node后端服务保活的实现

引言
目前的项目中使用了node，作为一个简单的后端服务，随着承担着越来越多的线上业务的服务，就要求了服务端的稳定性，而其中最重要的一点就是服务保活。有进程终止后自动重启的...

2020-05-27

101浏览

0评论

vue ssr服务端渲染(小白解惑)

>初学ssr入坑初学vue服务端渲染疑惑非常多，我们大部分前端都是半路出家，上手都是前后端分离，对服务端并不了解，不说java、php语言了，连node服务都还没搞明白，理解服务端渲染还是有...

2020-05-27

100浏览

0评论

webpack4 optimization使用总结

optimization总结minimize默认为true，效果就是压缩js代码。minimizer可以自定义UglifyJsPlugin和一些配置,默认的压缩为uglifyjs-webpack-plugin//比如在构建的时候,希望新增...

2020-05-27

74浏览

0评论

Vue项目中使用jsonp抓取跨域数据的方法

下载jsonp npm install jsonp 在js文件夹下新增一个jsonp.js,来封装一个jsonp()如何封装一个jsonp()在下载的jsopn中，jsonp（url，options，callback）这个是原生jsonp方法中的参数；...

2020-05-27

79浏览

0评论

浅析vue中的provide / inject 有什么用处

1.前言vue的父子组件通信用什么？：prop和$emit的组合。如果是爷孙组件呢？：那么就要用父组件来转发数据和事件了。如果是太爷爷和孙子组件呢？：当然是vuex啦emmm 好的，没我啥事了，我这...

2020-05-27

94浏览

0评论

聊聊Vue中provide/inject的应用详解

众所周知，在组件式开发中，最大的痛点就在于组件之间的通信。在 Vue 中，Vue 提供了各种各样的组件通信方式，从基础的 props/$emit 到用于兄弟组件通信的 EventBus，再到用于全局数...

2020-05-27

80浏览

0评论

javascript数组的定义及操作实例

数组是一组数据的集合，js中，数组里面的数据是可以
不同类型的定义数组：1.通过类实例化来创建数组
var alist01=new Array(1,2,3);2.通过直接量的方式来创建数组
var alist02=[1...

2020-05-27

90浏览

0评论

Vue.js watch监视属性知识点总结

这个属性用来监视某个数据的变化，并触发相应的回调函数执行1.基本用法
(1)添加watch属性，值为一个对象。对象的属性名就是要监视的数据，属性值为回调函数，每当这个属性名对应的...

2020-05-27

91浏览

0评论

javascript json对象小技巧之键名作为变量用法分析

本文实例讲述了javascript json对象小技巧之键名作为变量用法。分享给大家供大家参考，具体如下：有时候在项目开发过程中，我们需要json对象的键名作为一个变量，键名可变，传统的jso...

2020-05-27

73浏览

0评论

javascript 对象与 prototype 原型用法实例分析

本文实例讲述了javascript 对象与 prototype 原型用法。分享给大家供大家参考，具体如下：我们做程序开发的，经常面对的就是一个一个对象。那么在javascript中我们怎么去创建一...

2020-05-27

105浏览

0评论

jquery ajax 请求小技巧实例分析

本文实例讲述了jquery ajax 请求小技巧。分享给大家供大家参考，具体如下：jquery 是一个非常好用的js框架，它为我们提供了很多工具。启动异步请求就是很好用的一个工具官方推...

2020-05-27

76浏览

0评论

javascript/jquery实现点击触发事件的方法分析

本文实例讲述了javascript/jquery实现点击触发事件的方法。分享给大家供大家参考，具体如下：点击事件原声态和 jquery<%@ page language="java" pageEncoding="utf-8" cont...

2020-05-27

76浏览

0评论

JS 遍历 json 和 JQuery 遍历json操作完整示例

本文实例讲述了JS 遍历 json 和 JQuery 遍历json操作。分享给大家供大家参考，具体如下：json 遍历<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>demo...

2020-05-27

76浏览

0评论

javascript 高级语法之继承的基本使用方法示例

本文实例讲述了javascript 高级语法之继承的基本使用方法。分享给大家供大家参考，具体如下：高级语法的基本使用<script type="text/javascript"> //声明一个函数demo functi...

2020-05-27

64浏览

0评论

微信小程序监听用户登录事件的实现方法

最近在开发小程序，小程序既需兼顾针对新用户的内容预览，又要为注册用户提供服务，简单梳理下，基本需求如下：小程序共三个tab页，所有用户都可以浏览首页内容，了解我们可以提供的优...

2020-05-27

121浏览

0评论

vue与django集成打包的实现方法

1.首先创建 django项目并在 django项目文件下创建vue项目
2.修改django项目文件下的setting.py
修改django模板路径指向 vue项目的distTEMPLATES = [ { 'BACKEND': 'd...

2020-05-27

260浏览

0评论

vue把输入框的内容添加到页面的实例讲解

vue最最最简单的demo（记得引入）实例化一个vue，绑定#app的元素，要渲染的数组arr作为data。把arr的item渲染到页面，输入内容点击按钮把用户输入的内容添加到页面以及数组<!DOCTYPE...

2020-05-27

96浏览

0评论

JS中比较两个Object数组是否相等方法实例

一、问题在js中是不能直接用“==”或者“===”来计算两个数组是否相等的，那么就需要对数组的值进行比较；二、次解决方案对于比较两个数组次要的方法有如下几种，为什么说是次要...

2020-05-27

106浏览

0评论

使用vuex存储用户信息到localStorage的实例

1、首先需要装vuexnpm install vuex -d2、新建store文件夹，新建index.js，并引入vue、vuex,代码如下：import Vue from 'vue'import Vuex from 'vuex' Vue.use(Vuex)const key =...

2020-05-27

66浏览

0评论

vue 实现通过vuex 存储值在不同界面使用

通过vuex 存储1. 创建store.js文件import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const state = { //要设置的全局访问的state对象 count: 1, //要设置的...

2020-05-27

150浏览

0评论

VUE:vuex 用户登录信息的数据写入与获取方式

整体思路：前台获取用户数据，向后台发送post请求，验证成功后前台接受数据，改变用户登录状态将登录状态及用户数据写入到state中这样多个页面就可以直接使用this.$store.getters.g...

2020-05-27

83浏览

0评论

Vuex实现数据增加和删除功能

首先，我们要安装vuex，执行命令yarn add vuex1.编写state数据//vuex/index.jsimport Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const state = { bookList: [...

2020-05-27

89浏览

0评论

vuex存储token示例

1.在login.vue中通过发送http请求获取token//根据api接口获取token var url = this.HOST + "/session"; this.$axios.post(url, { username: this.loginForm.username, pass...

2020-05-27

63浏览

0评论

vue在路由中验证token是否存在的简单实现

1. 在router/index.js进行验证2. 代码如下：import Vue from 'vue'import Router from 'vue-router'import Login from '@/components/common/Login';......Vue.use(Router)co...

2020-05-27

198浏览

0评论

vue路由守卫,限制前端页面访问权限的例子

今天给大家写一篇关于vue校验登录状态，如果是非法登录就跳转到登录页面的逻辑首先需要写一个路由守卫，它的原理是每次路由发生变化时触发具体写法如下：router.beforeEach((to,...

2020-05-27

73浏览

0评论

vue 更改连接后台的api示例

vue 更改连接后台的api，是更改在config文件夹下的index.js文件中的proxyTable的值。
如下代码，其中 10.1.166.88:8888/springTimes 为后台暴露出来的appi。dev: { env: requ...

2020-05-27

71浏览

0评论

vuex实现数据状态持久化

用过vuex的肯定会有这样一个痛点，就是刷新以后vuex里面存储的state就会被浏览器释放掉，因为我们的state都是存储在内存中的。所以我们通过 vuex-persistedstate这个插件，来实现...

2020-05-27

热门文章