首页 > 其他分享 >vue 面试题

vue 面试题

时间:2024-06-08 11:02:43浏览次数:7  
标签:面试题 vue 对象 Vue 组件 router 路由

为什么组件的data必须是一个函数

 *     原因:将来多个组件打包后 会合并到一起 一旦组件之间有data数据重名就可能出现覆盖的情况  导致打包之后数据混乱

 *     所以组件的data是一个函数 就形成了一个闭包  数据就变成了局部变量 就算都打包合并到一起 不同的

 *     组件就是不同的局部变量 数据重名也互相不影响

手动配置Router

vue-Router v3.x是针对vue2项目  v4.x是针对vue3项目的

    要想配置路由 必须先下载路由模块(正常是下载好的 我们在自己搭建项目的时候选择vue-Router的情况下就是下载好的)

    npm i vue-router@版本号 --save(3.5.4)

    --save 是把当前下载的模块登记到package.json的依赖里面(要不然的话别人拿到之后下载依赖没有vueRtouer就报错)

    -g 表示全局安装到计算机c盘

    下载模块的时候如果是vue2项目记得要加版本号 不然就是安装最新版 是适配vue3项目的

    vue-router搭建步骤(v3.x)

    1 下载vue-router模块  npm i [email protected] --save

    2 在src文件夹里面新建router文件夹在这个文件夹里面新建index.js

    3 import Vue from 'vue'

    4 import VueRouter from 'vue-router'

    5 Vue.use(VueRouter)

    6 new VueRouter(options) 进行路由表的配置

    7 options路由表的配置对象常用的属性:

        routes 是一个数组 数组里面的每一个对象都是一个路由对象

        路由对象常用属性:

          {

            path:'' 目前暂时所有路径都以/开头(表示都是首页同级的页面)  页面跳转的路径

            component:当前路由对象渲染的组件对象

            name:''路由的name值 以后跳转方式其中一种是根据name跳转的 也算是当前路由的唯一标识

            meta:{当前路由的初始数据配置 可以在组件里面通过this.$route.mate.属性名获取

            }

          }

    8 把当前创建出来的路由表对象 对外暴露  export default router

    9 在main.js引入router对象 并注册到Vue的options对象里面

      new Vue({

        render: h => h(App),

        router,//注册路由表对象到全局Vue对象中 让真个项目具有路由的功能

      }).$mount('#app')

    10 最后把router-view组件 定义在app.vue组件的template里面

        表示路由对应的path渲染的组件最终呈现的位置

标签:面试题,vue,对象,Vue,组件,router,路由
From: https://blog.csdn.net/2401_82679799/article/details/139543648

相关文章

  • Dubbo面试题甄选及参考答案
    目录Dubbo是什么?Dubbo的主要使用场景有哪些?Dubbo的核心功能有哪些?Dubbo与Spring框架的集成方式是什么?Dubbo的RPC调用原理是什么?Dubbo的架构中包含哪些核心组件?Provider、Consumer、Registry、Monitor在Dubbo中分别承担什么角色?Container在Dubbo中的作用是什么?Dubbo的C......
  • 整理好了!2024年最常见 20 道分布式、微服务面试题(一)
    一、什么是分布式系统?分布式系统是由多个独立的计算机(通常称为节点)组成的系统,这些计算机通过网络连接在一起,协同工作以完成一个共同的任务或服务。以下是分布式系统的关键特点和概念:网络依赖性:分布式系统中的计算机节点通过网络进行通信。网络是分布式系统的基本组成部分。......
  • vue3 + arcgis.js4.x---线段SimpleLineSymbol
    //polylineconstpolylineGraphic=newGraphic()polylineGraphic.geometry={type:'polyline',paths:[[117.227239,31.820586],[116.227239,33.820586]]}polylineGraphic.symbol=newSimpleLineSymbol({color:'#ff0000&#......
  • vue3 + arcgis.js4.x---面SimpleFillSymbol
    //polygonconstpolygonGraphic=newGraphic()polygonGraphic.geometry={type:'polygon',rings:[[117.227239,31.820586],[116.227239,33.820586],[117.227239,33.820586]]}polygonGraphic.symbol=newSimpleFillSymbol({......
  • 【手撕面试题】Vue(高频知识点四)
            每天10道题,100天后,搞定所有前端面试的高频知识点,加油!!!在看文章的同时,希望不要直接看答案,先思考一下自己会不会,如果会,自己的答案是什么?想过之后再与答案比对,是不是会更好一点,当然如果你有比我更好的答案,欢迎评论区留言,一起探讨技术之美。目录面试官:请简述一下k......
  • 【计算机毕业设计】ssm714实验室预约管理系统+vue
    身处网络时代,随着网络系统体系发展的不断成熟和完善,人们的生活也随之发生了很大的变化,人们在追求较高物质生活的同时,也在想着如何使自身的精神内涵得到提升,而读书就是人们获得精神享受非常重要的途径。为了满足人们随时随地只要有网络就可以看书的要求,实验室预约管理被开发......
  • vue + springboot 实现Excel模板文件下载
    1、后端实现1.创建用于映射模板的实体类@DatapublicclassSysUserTo{@Pattern(regexp="^(\\w+([-.][A-Za-z0-9]+)*){3,18}@\\w+([-.][A-Za-z0-9]+)*\\.\\w+([-.][A-Za-z0-9]+)*$",message="邮箱格式有误")@Size(max=50,message="邮箱超出50长度&q......
  • vue 连接mqtt
    下载mqtt服务:npminstallmqttconstmqttConfig={//你的MQTT服务器配置protocolId:'MQTT',protocolVersion:4,clean:true,clientId:'xxxx',reconnectPeriod:1000,connectTimeout:60*1000,//will:{//topic:�......
  • Vue Router 4与路由管理实战
    title:VueRouter4与路由管理实战date:2024/6/7updated:2024/6/7excerpt:这篇文章介绍了如何在Vue.js应用中利用VueRouter实现单页面应用的路由管理,包括配置路由、导航守卫的使用、路由懒加载以优化性能以及动态路由的实现方法,旨在提升用户体验和应用加载效率categorie......
  • 基于SpringBoot+Vue的网上花店系统设计与实现(源码+lw+部署文档+讲解等)
    文章目录前言详细视频演示项目运行截图技术框架后端采用SpringBoot框架前端框架Vue可行性分析系统测试系统测试的目的系统功能测试数据库表设计代码参考数据库脚本为什么选择我?获取源码前言......