Vue 开发学习(持续更新)

Vue 开发学习(持续更新)

全局函数配置

全局组件引入

在app.js 下面注册组件

import User from ‘./components/Users’

注册

Vue.components(“users”,Users)

类似这样

// 组件引入
import ToastTitle from "./components/toastTitle/index";
import Vue from 'vue';

// 注册全局组件
Vue.component("ToastTitle", ToastTitle)

然后可以在任何页面调用

<ToastTitle></ToastTitle>

如何在单独的JS 文件调用Vuex

在需要引用的JS文件调用store就也跨一了,store.commit(‘时间名称’)

import store from './store.js';

console.log(store.state);
store.commit('xxx');

全局函数

有时候我们对于一些放在HTML的全局函数,我们不想在每个.vue文件里面引用,我们可以在

app.vue里面去定义一个全局通用函数,调用起来的就直接用就可以了

例如:

<div @click = "gobalClick"> 
    
</div>

main.js

Vue.prototype.inputBack = function () {
  setTimeout(() => {
    const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
    window.scrollTo(0, Math.max(scrollHeight - 1, 0));
  }, 100);
}

就类似于上面,定义葛vue全局属性,属性里面包含一个全局函数,当vue页面上面需要调用的时候,就直接用函数名称调用