首页 > 其他分享 >vue 动态引入 js 文件

vue 动态引入 js 文件

时间:2023-10-18 17:33:52浏览次数:33  
标签:vue normal utils js 引入 type options

在目录 比如utils/options/ 下面建不同名字的 js,再根据  this.type 变量的值动态引入。(注意 this.type 变量的值要和相对应的 js 文件名一致

  onl oad (options) {
    this.type = options && options.type
    const file = require(`@/utils/options/${this.type}.js`)
    this.typeData = file.default
  }

如果 this.type 变量的值是'normal',就会把 normal.js 引入。是其他的值,就建相应的 js 文件。

normal.js

const collectionModel = {}
export default collectionModel

 

标签:vue,normal,utils,js,引入,type,options
From: https://www.cnblogs.com/liuyongfa/p/17772936.html

相关文章

  • vue3.x增加数据功能
    具体代码<template><el-form:model="form":rules="rules"ref="ruleFormSSS"label-width="120px"><el-form-itemlabel="用户姓名"prop="name"><el-inputv-model="form.......
  • 需求:vue3+swiper+ts实现轮播图(中间主体轮播,左右各显示部分)
    一、下载安装swiper安装:pnpminstallswiper使用你熟悉的方式来安装(yarnnpmcnpm)二、在项目中引入swiper1.main.js文件点击查看代码import'swiper/swiper-bundle.css';import"swiper/css"2.页面代码实现点击查看代码<scriptsetup>import{ref,reactive}fr......
  • [MAUI]深入了解.NET MAUI Blazor与Vue的混合开发
    @目录Vue在混合开发中的特点创建MAUI项目创建Vue应用使用element-ui组件库JavaScript和原生代码的交互传递根组件参数从设备调用Javascript代码从Vue页面调用原生代码读取设备信息项目地址.NETMAUI结合Vue的混合开发可以使用更加熟悉的Vue的语法代替Blazor语法,你现有项目不必重......
  • 26-Vue脚手架-分析脚手架
    将 24-Vue组件化编程-单文件组件 放到使用Vue脚手架创建的vue_test项目中 脚手架文件结构├──node_modules├──public│├──favicon.ico:页签图标│└──index.html:主页面├──src│├──assets:存放静态资源......
  • [vue]精宏技术部试用期学习笔记 II
    精宏技术部试用期学习笔记(vue)router:vue的模拟路由前置准备安装vue-routerpnpmivue-router@4//安装版本4的vue-router可以在package.json文件中查看依赖"dependencies":{"vue":"^3.3.4","vue-router":"4"//这里},新建文件夹/src......
  • vue进行跳转之后出现Cannot read properties of undefined (reading 'router') TypeEr
    问题描述使用router进行页面跳转时,就出现了这样的问题:也就是这里出现了问题:问题解决本来是按照网上的教程:const_this=this;但是,但是,我本来就是用的这种方法呀~然后就打算直接在这个界面引用:importrouterfrom'@/router'router.push('/one');里面引用的跳转页面......
  • Vite+Vue3 加载速度优化
    可以考虑从以下几个方面优化。整体思路:1.减小打包体积。2.异步加载。静态资源拆分打包在常规打包方法下,所有的第三方依赖将会都打包在一个vendor.js文件里,首次打开页面时,服务器会先加载这个大文件,导致白屏时间过长。而我们打包时,事先将依赖拆分成很多小文件各自进行打包,便可......
  • vue点击文字打开扩展列
    <template><custom-cardshadow="hover"bordered><divclass="system-search"><divclass="search-box"><el-inputclass="box-input"placeh......
  • Vue 实现 PDF 导出功能
    旨在通过html2canvas和jspdf,先将页面的html转成canvas,再将canvas转成pdf,同时解决了分页截断的问题。安装依赖yarnaddhtml2canvasyarnaddjspdf思路通过网上的一些教程,初步实现了html转pdf的功能,将一整个DOM元素放进去,虽然可以粗糙实现,但是出现了很多地方......
  • JS 通过年份获取月,季度,半年度,年度
    ​ 功能描述:实例化一个函数,给函数内传递不同的参数,获取从起始年份到现在年度所有的月份,季度,半年度,年度动态演示  ---------正文代码开始--------1.封装函数 createMonth注:此代码可直接复制黏贴使用functioncreateMonth(){lettypeText="";lettoday=ne......