vuex的全局挂载和Vue.prototype的区别 和优势

最新推荐文章于 2024-02-26 16:10:32 发布
最新推荐文章于 2024-02-26 16:10:32 发布
阅读量2.1k 收藏 2
点赞数 2
文章标签： javascript ViewUI
原文链接：https://my.oschina.net/u/2428630/blog/3064820
版权

Vue.prototype.XXX 上的数据是静态的，只能通过手动修改，修改后数据变了，但使用这些数据的组件并不会重新渲染，也必须得手动渲染。Vue.prototype.XXX 相当于是在 Vue 对象上增加全局属性，容易造成变量污染。

Vuex 只要 store 中的数据更新，就会立即渲染所有使用 store 数据的组件。Vuex 使用单向数据流，要想修改 store 数据需要经过 action 层，mutation 层，层次划分明确，便于管理。

转载于:https://my.oschina.net/u/2428630/blog/3064820

chs00062
关注
vue2 全局变量的设置方法
08-27
Vue2 中设置全局变量有两种方法：全局变量专用模块和全局变量模块挂载到 Vue.prototype 里。 1. 全局变量专用模块 全局变量专用模块是以一个特定模块来组织管理这些全局量，需要引用的地方导入该模块便好。例如，...
VUE——全局变量模块或全局方法挂载到Vue.prototype里使用
热门推荐
kinding的博客
09-28 2万+
比如登录后返回token，将token存入cookie，其他页面或请求的时候需要判断有没有cookie，请求的时候需要带上cookie，没有则返回登录。这样一来多个页面位置上需要去拿cookie，需要封装函数方法，并导入。 如多将此方法挂载到Vue.prototype上，则其他地方只需要：this.挂载的名称   即可使用 这样一来，很多需要多次重复使用的全局函数都可以挂载，以便其他地方使用， 以...
vue 项目接口api批量挂载到vue实例上
yanghuide1的博客
07-06 1415
每个接口api都需要一个一个导入，不仅效率很低，代码结构也显得特别冗余，有两种批量挂载vue方式，可以根据自己的需求自行选择
vue全局公共方法的理解以及install实现统一管理
junjiahuang的博客
11-02 585
全局公共方法三种实现： 按需引入 import {xxx1, xxx2} from '@/utils' mixin混入 Vue.extend({ mixins: [myMixin] }) 挂载到vue的prototype上 import utils from '@/utils' Vue.prototype.$utils = utils 优缺点分析： 每次都要手动引入，开发效率低，但能减少引入。 单从混入方法来讲，全局混入容易造成污染，也会有不必要的引入（vue自身优化掉不使用的函
浅谈vue 中，use() 和prototype作用和区别
qq_40058272的博客
03-29 278
当一个插件对象或者函数，拥有install方法时，就使用Vue.use()。调用Vue.use()时会调用插件的install方法，使得其能够全局使用。vue.prototype是一种注册全局变量的方式，使用vue.prototype的变量可以全局访问。官方文档中提到，Vue.use()可以用来注册全局的插件。使用Vue.use()后可以使得插件能够在项目的任意位置上使用。，使得install的具体变量能够全局使用，包括全局变量，全局标签等等。注册的全局的变量以$开头，调用this方法调用。
vue中xss详细配置
沃德天，倪维胜么，捺莫帅？
09-25 3840
xss文件 import xss from 'xss'; // 导入xss包 const options = { // 白名单 whiteList:{ a: ['style', 'href', 'title', 'target'], p:['style'], section: ['style'], strong: ['style'], abbr: ["title",'style'], addres
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
10-15
3. 使用Vue.prototype将公共方法挂载到Vue的原型链上。 例如： ```javascript // common.js export default { login: function() { console.log('用户登录方法'); } } // main.js import Vue from 'vue' ...
在vue里面设置全局变量或数据的方法
11-28
总结，通过创建自定义Vue插件并在`Vue.prototype`上挂载变量，可以在Vue应用中设置全局变量。这种方法简单易行，但需谨慎使用，以保持应用的可维护性和性能。在实际开发中，根据项目的规模和需求，可以选择更加合适...
vue自定义全局共用函数详解
01-21
如果你需要让一个工具函数在每个组件可用，可以把方法挂载到 Vue.prototype上。 在main.js中： Vue.prototype.method = function () {} 组件中调用： this.method() 以上这篇vue自定义全局共用函数详解就是小编...
vue的全局变量和全局拦截请求器的示例代码
01-19
将全局变量模块挂载到Vue.prototype里，在程序入口的main.js里加下面代码： import Global from '../components/Global.vue' Vue.prototype.global = Global 挂载后，在需要引用全局变量的模块时，不需要再导入全局...
网络安全---Vue中解决XSS（跨站脚本攻击）
最新发布
总结、沉淀、提升
02-26 1711
Vue中解决XSS的办法是...
Vue.prototype、Vue.component和Vue.use的区别
潮黯的博客
02-20 186
Vue.prototype：你可能会在很多组件里用到数据/实用工具，但是不想污染全局作用域。这种情况下，你可以通过在原型上定义它们使其在每个 Vue 的实例中可用Vue.component：注册全局组件，第一个参数是调用组件时写的组件名，第二个参数是引入组件时写的标签名称，常用于注册自定义组件Vue.use：注册全局插件，会自动阻止多次注册相同插件，届时即使多次调用也只会注册一次该插件，插件应该暴露一个 install 方法，当 install 方法被同一个插件多次调用，插件将只会被安装一次。
Vue全家桶之Vuex
荷逸的博客
05-02 793
Vue全家桶之Vuex 认识Vuex Vuex与vue.prototype的区别 状态管理 单页面状态管理 多界面状态管理 Vuex状态管理 Vuex核心概念 State Getters 参数 Mutation 传递参数： 提交风格 响应规则 类型常量 同步函数 Action 基本使用 Module 局部状态 Vuex的基本使用 初始代码 state的使用 获取state对象 获取state中的某数据 getters的使用 只有参数state 参数state、getters mutations的使用 只有参
xss防注入使用插件（vue项目中）
Eric_web的博客
04-16 1593
用了这个插件：https://jsxss.com/zh/index.html github地址：https://github.com/leizongmin/js-xss import axios from ‘axios’ import store from ‘@/store/index’ import md5 from ‘md5’ import xss from ‘xss’ import { _encryptPhone, isEmojiStr } from ‘./common’ import loadMa
使用Vue.prototype 和 vue.use()实现全局方法的区别
qq_35430000的博客
07-19 2672
转载自：https://www.jianshu.com/p/03c6b1b2941b 经常在main.js中看到 Vue.prototype.$xxx = xxx; 和使用vue.use() api.js 我在学习使用的过程中，都实现了数据调用 想知道这两者的区别 首先，不管你采用哪种方式，最终实现的调用方式都是 vm.api() 也就是说，两种方法，实现的原理都...
Vue.prototype详解
如果相遇，那么你好哦~
10-10 3488
在 Vue.js 中，经常会看到 this.$XXX 这种写法，那么这个是什么呢？其实这里就是使用 Vue.prototype 所定义的一个挂载到本身的全局方法，主要是为了防止全局变量的污染，所以我们来共同商议的一种写法。Vue.prototype 可以用来添加一些全局的属性或方法，使其在每个 Vue 实例中都可用。Vue.prototype 可以添加任何类型的属性或方法，比如：常量、对象、方法等。它是就是解决 替换全局使用的一个标识。
前端XSS攻击场景与Vue.js处理XSS的方法：vue-xss
zhangzuying的博客
12-21 5026
在前端开发中，跨站脚本攻击（XSS）是一种常见的安全威胁。本文将介绍前端跨站脚本攻击（XSS）的场景以及在Vue.js框架中如何处理XSS的方法。通过了解这些内容，我们可以更好地保护前端应用程序的安全性，防止恶意攻击。一个开箱即用的Vue.js插件，可通过简单的方式防止XSS攻击。
uni-app 全局变量的几种实现方式【Vuex，Vue.prototype、公共文件】【多组件传参且改变html元素状态时Vuex优先】
weixin_43343144的博客
06-13 5396
uni-app 全局变量的几种实现方式：http://ask.dcloud.net.cn/article/35021 【非常重要】对于uni-app框架在app或微信端来说,Vue.prototype和Vuex就有差别了！【在uni-app框架的app平台中，html标签中无法直接访问Vue的全局属性和方法，而Vuex却可以直接访问】 Vue.prototype.$amount = 1...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值