选择题

1.下列选项用于设置Vue.js页面视图的元素是#xff08;#xff09;。

Template

16.以下v-model修饰符能够将字符型数据转换为数值型数据的是。

A..number

1.父组件中绑定message[ABCD]传递给子组件在子组件中显示message.length的值是。

2.父组件向子组件传递数据时子组件可以通过属性来声明使用父组件的变量。

data

3.在父组件上使用指令来监听事件子组件中可以使用this.$emit“input,this.子组件属性)。

v-model

5.父组件通过某个元素的属性可以将数据信息传递至指定的具名插槽中。

name

6.一个单文件组件是由、script、style等3个标记元素组成。

slot

13.Nodejs在执行JavaScript任务时一般采用处理方式是

A.多线程

16.Nodejs中能够用来搭建HTTP服务器和客户端的模块是。

path

4.将默认导出的store对象注册到根实例中可通过Vue的选项来实现。

store

5.在辅助函数前面加上可以实现Vuex状态与局部计算属性混合使用。

...

6.下列选项中能够正确分发Action触发increment这个mutation的指令是。

commit(increment)

9.在VueRouter中必须显式地使用Router下列选项中正确的使用方法是。

Vue.use(Vuex)

10.下列选项中能够正确表达跳转到/user/chu的路由是。

{path:user/:chu,component:User}

{path:user/:id

12.在编程式导航中能够跳转到新的路由且在历史记录中添加一条新记录的方法是

router.back()

B.Vuejs的核心库只关注视图层不仅易于上手还便于与第三方库或既有项目整合。

D.当与现代化的工具链以及各种支持类库结合使用时Vuejs也完全能够为复杂的单页应用SPA(SinglePageApplication)提供

JavaScript

A.Vue实例被创建后View视图会产生响应匹配data中更新的数据。

15.以下关于Vue.set(target,propertyName/index,value)描述错误的是

B.propertyName/index可以是字符串或者数值型

push()

C.过滤器不能替代computed、methods、watch

:valuevalueA

A.用于条件性地渲染一块内容。

当指令的表达式的值为true时内容被渲染

B.使用v-else指令需要紧跟在v-if或者v-else-if后面否则不起作用

D.v-else-if可以充当v-if的else-if块可以链式的使用多次以实现switch语句的功效

D.input添加了key属性后用户在切换input时里面的数据不会被清除

A.布尔值

7.在下列选项中等同于JavaScript中的event.preventDefault()的修饰符是。

A..prevent

B.多个复选框绑定到同一个数组同时给每个复选框设置不同的id值和value值

D.单选按钮绑定到一个数组

14.Vue.js中钩子函数可以在被绑定元素插入父节点时调用。

componentUpdated

15.自定义指令时钩子函数的参数binding中。

属性代表字符串形式的指令表达式。

name

16.下列代码中为了实现输入框和Vue实例双向数据传递空格处的指令是。

div

message[E,F,G]”/my-component,在子组件中显示message.length的值为。

19.父组件向子组件传递数据子组件可以使用以下选项来获取数据。

v-model

20.下列代码中横线处应该使用来引用组件myComponent。

div

v-on:clickcount被单击{{count}}次/button’

var

1.使用Vue.component(tagNameoptions定义的组件属于()注册方式

B.局部注册

2.子组件使用this.$emit‘input’this子组件属性向父组件传值时父组件中应该使用指令来监听。

v-bind

3.自定义事件中子组件用来触发自定义事件父组件使用$on来监听子组件的事件。

$on

5.要动态地绑定父组件的数据到子组件的props需要使用指令。

v-model

6.props选项的类型可以用于对外部传递进来的参数进行数据验证。

A.数组

Vue())来完成发送和接收消息。

其中bus.$emit()在组件中通过自定义事件来()消息。

A.接收

9.没有命名、有目只有一个插槽称为默认插槽default或称为(

A.作用域插槽

10.在子组件中具名插槽是通过slot元素的属性进行设置在父组件中通过标记的属性或template标记的v-slot:slotname来实现。

class,

11.父组件通过某个元素的属性可以将数据信息传递至指定的具名插槽中。

name

12.一个单文件组件由、script、style等3个标记组成。

slot

3.动态组件需要通过Vue中的component元素绑定属性来实现多组件的过渡。

v-for

A.Node.js为每一个模块提供一个exports变量这个变量指向module.exports。

B.在对外输出接口时可以向exports对象添加方法如exports.addfunction{}。

C.可以直接给exports赋值一个变量如exportsfunction{}。

D.exports对象是当前模块的导出对象用于导出该模块的公有方法和属性。

A.module.filename

httprequire(‘http’);http.createServer().listen(8080);

server.on()

server.on(‘request,function(request,response){...})

cmdea

6.当前路由对象中属性会保存当前路由的路径总是解析为绝对路径。

this.$route.query

A.route它是一条路由使用(...)来定义通常会包含两个属性分别是path、component,实现路由与组件的映射。

B.routes它是一组路由把每一条条路由组合起来形成一个数组也称为路由表类似于[route1,route2...]。

C.router-link表示路由出口。

该组件用于将匹配到组件相当于链接的页面渲染在这里。

D.router它是路由管理器用来管理路由。

当用户点击导航时路由器会到routes中去查找去找到对应的路由组件页面中就显示对应组件的内容。

$route.params

11.下列选项中能够实现项口初始化并创建package.json的命令是

npm

13.在设置多出口路由时可以使用命名视图通过设置router-view组件的属性来定义。

name

14.在路由组合中定义命名视图需要在route中通过属性来注册多个路由组件。

A.component

15.在定义路由组件传参时如果使用布尔模式的props传值需要在路由中设置同时在路由组件中使用props属性来传值。

props

16.路由组件传值时使用props为对象在路由组件中需要将props属性定义为类型。

A.数值型

19.在编程式导航实现“返回首页”并与router.push(Home)相同功能的选项是。

其中首页组件名为Home,路径为/home。

router.go(1)

20.在定义子路由时通常不需要在子路由的path属性中添加,而是直接书写子组件名称。

A.”.”

1.通常采用vuecreatevue-router-5创建项目选择需要VueRouter后生成的有关路由的配置文件保存的路径为

src/router/index.js

4.从组件中提交一个mutationtype:increment正确的方法是

C.this.$store.commit(increment)

D.this.store.dispatch(increment)

5.Vuex通过在根实例中注册选项将状态注入到根组件下的所有子组件中且子组件能通过this.$store访问到。

store

B.在组件中直接给this.$store.state.count赋值

C.修改getter中赋值

9.Vuex中能够触发mutation函数从而修改状态支持异步的对象是

A.state

10.可以实现mutations中事件处理函数状态提交的选项是

A.commit

11.mutations中的事件处理函数可以接受作为参数即初始数据。

A.actions

state.namestate.name.slice(0,3)Ming

ChuJiuliang1

15.下面选项中可以用来创建vue项目的命令(vue/cliV3.x)的是

vue

A.Vuex的状态存储是响应式的当store中数据状态发生变化那么页面中的store数据也发生相应变化。

B.this.$router.state可以获取到store中的state数据

C.改变store中的状态的唯一途径就是显式地提交mutation

17.在项目的main.js文件中createApp(App).use(store).use(router).

mount(#app这种调用方式称为

20.Vue3.0中组件内部暴露出所有的属性和方法的统一API的选项是

ref

1.对于watchEffect来说可以将watchEffect(返回值赋给stop然后可以使用可以清除依赖实现停止监听。

stopwatch

3.Vue3.0在setup函数中使用下列语句可以实例化路由。

A.const

4.Vue3.0在setup函数中可以使用语句来定义store实例。

const

6.当使用组合式APl时reactive、refs和template

refs的概念已经是统一的。

为了获得对模板内元素或组件实例的引用可以像往常一样在中声明一个ref对象并返回它。

function()

1.Vue.js根实例中el选项主要用于指定挂载元素,data选项主要用来定义数据对象,template选项主要用来定义HTML模板。

2.在使用Vue.js时建议在GoogleChrome浏览器上安装Vue

Devtools拓展程序它允许在一个更友好的界面中审查和调试Vuejs应用。

3.Vuejs中插值分为文本、HTML代码、属性、JavaScript表达式等多种形式。

4.computed属性默认只有getter但Vue允许设计人员在需要时可以为其提供一个setter。

5.控制台显示信息的命令是console.log(),表格型输出数组和对象的命令是console.table()。

6.定义方法需要在methods选项中进行设置。

实时响应data中数据变化而做出一些处理需要在computed选项中进行设置。

7.为对象添加新属性可以使用Vue.set()方法才能被实时响应。

查看Vue实例中data对象可以使用vm.$data实例属性。

8.Vue中数组变异方法中能够在数据任意位置插入新元素的方法splice(),是能够在数组末尾添加新元素的方法是push()。

9.Vuejs中条件染指令有v-if、v-else、v-else-if和v-show。

10.Vue实例中用于定义挂载元素的选项是el。

用于定义模型数据的选项是data。

11.内置指令中能够隐藏未编译的元素的指令是v-model能够输出HTML标记和内容的指令是v-text。

能够实现与表单元素进行绑定的指令是{{}}。

输出元素内容的指令是v-html它等价于使用v-cloak来显示数据属性的值。

12.自定义指令的注册方式有两种分别是局部注册、全局注册。

自定义指令仍然使用v-作为指令的前缀。

13.组件注册分为全局和局部两种方式。

全局注册必须使用Vue.component(‘componentname’)指令来实现局部注册组件必须在Vue实例中的components选项中注册。

14.组件中data选项必须定义为函数形式格式如data(){return

{}}.

15.单组件文件的后缀名是.vue,需要使用vue-loader来解析。

16.插槽通常分为匿名默认插槽、具名插槽、作用域插槽等。

在父组件可以使用slot属性来将信息插入到指定的具名插槽中也可以使用v-slot指令来使用指定的插槽。

4.使用Vue-cliwebpack创建Vue项目时在完成项目初始化后通常还需要再执行两条命令它们分别是cd

projectname、npm

6.在index.js文件中导入Vuex的JS语句是import

Vuex

from‘vuex’。

将定义好的store对象作为默认导出接口的语句是export

default

7.在Vue组件中通过mapState辅助函数可以获得Vuex的状态。

也可以使用计算属性来获取。

storenew

Vuex.Store({...})。

在组件中定义data选项只能定义为函数方式格式为data(){return

9.state对象中的teacher对象原来有name、sex两个属性现在需要增加age属性初始值为45正确的添加方法有两种第一种使用Vue.set语句为Vue.set(state.teacher,‘age’,45)。

第二种对象替代法语句为state.teacher{...state.

10在使用命名空间的模块Teachers中定义一个名为“addOneTeachers”这一action在App.vue组件中methods中使用mapActions辅助函数定义方法addOneTeachers的正确的语句是

(...mapActions(‘Teachers,[‘addOneTeachers])。

11Element

UI组件Basic、Form、Data、Notice、Navigation、Others等六大类。

其中基础组件中的Button按钮使用el-button标记其它组件中的Dialog对话框使用el-dialog标记。

13.Mint

UI组件分JS组件、CSS组件、Form组件等三类每类组件内包含若干个子组件。

14.VantUI主要分基础组件、表单组件、反馈组件、展示组件、导航组件、data(){return{...}}

el-breadcrumb标记来实现导航使用el-breadcrumb-item属性作为分隔符使用separator标记表示从首页开始的每一级。

17.sessionStorage中保存数据使用sessionStorage.setItem(key,value)方法删除数据使用sessionStorage.removeltem(key)方法。

18.在Vue

3.0中使用createApp()实例(id为app)不再需要像Vue2.x中那样使用new

Vue({})方式来创建实例。

使用mount(‘#app’)法来挂载实例。

19.在Vue3.0中定义响应式对象可以通过函数ref、reactive来定义。

但当参数为数组和对象时通常使用reactive来定义。

当参数为基本数据类型一般会使用ref来定义。

create

vue3-pro-1命令。

创建完成后需要切换至项目所在文件夹为项目添加Vue3.0的vue-next插件的命令是vue

add

1.setup()可以接收两个参数第一参数为context第二个参数为value。

Setup(函数内部定义的响应式对象变量在函数体内使用时需要添加props而在模板中使用时则不需要可以直接展开。

2.mainjs文件主要功能是分别导入相关函数、组件创建App实例、启动状态管理、启动路由以及挂载#app在代码中填写相关语句。

代码如下

2.import{createApp}from‘vue’//从vue中导入createApp函数

3.import

6.createApp(App).use(store).use(router).mount(‘#app’)

3.setup()函数内部不能使用this可以使用context来替代this.setup()函数内部定义所有属性和方法都必须使用return返回出来供组件模板使用。

4.子组件使用父组件传递的数据时可以在子组件中设置props选项设置传递参数时需要指定参数的数据类型。

5.使用响应式数据函数可以将reactive()创建出来的对象转换为普通对象但这个对象上的每一个属性节点都是ref()类型的toRefs()在组件模板中可以单独使用。

在return中使用时需要在其前面加上展开...运算符。

6.用watch或watchEffect执行监听时如果需要停止可以将watch()或watchEffect()的返回值赋给stop然后在使用stop()函数显式停止监听行为。

7.给模板中的元素设置ref属性可以实现引用DOM元素然后在setup()函数内部需要定义ref响应式对象并在return中将该对象返回出来才能正确引用。

8.父组件通过provide()函数为子组件或后代组件提供两种类型的共享数据这两种类型分别为普通数据、响应式数据。

子组件或后代组件可以使用inject()函数来使用共享数据。

9.在中to属性的值可以是对象也可以是一个描述地址的字符串路径。

10.在使用标记定义命名视图时可以使用的属性是name。

在嵌套视图的应用中定义路由时需要将component属性改为components。

11.在VueRouter项目中可以通过$route.fullPath属性获取路由信息对象的完整路径可以通过$route.path属性来获取当前路由的路径。

12.定义嵌套路由时可以在某路由下使用children属性来下定义子路由。

定义子路由时path属性值可以不加’/’符号直接写路径名称。

13.路由传参时可以一条路由记录中使用props属性并且设置其值为true然后在路由组件中使用props选项来说明参数。

14.VueRouter默认路由模式为hash此时URL会包含“#”号。

如果将模式设置为history时URL才像正常的URL。

15.创建一个Vue应用程序需要3个步骤引入Vue.js库文件、创建Vue实例、渲染Vue实例。

16.在Vue实例的配置中el用来选择页面上已存在的DOM元素作为Vue实例的

17.在MVVM架构下View和Model是通过ViewModel进行交互的。

18.Vuejs中的插值分为文本、HTML代码、属性、JS表达式。

div

20.用属性绑定的方法实现给input元素设置名字属性值为ip1input

:name’ip1’

3.控制台中console.dir()命令用来显示一个对象所有的属性和方法。

4.方法console.time()和console.timeEnd0用来显示代码的运行时间。

5.控制台可以查看Vue实例属性data的语句是console.dir(vm.$data)其中vm为Vue实例对象。

6.局部过滤器可以定义在Vue实例内部用filters:{}属性定义一个或多个局部过滤器。

7.v-show和v-if的不同之处有1实现方式不同。

(2)编译过程不同。

(3)编译条件不同。

(4)性能消耗不同。

8.Vue.js中条件渲染指令有v-if、v-else、v-else-if、v-show。

10.在动态地、响应式更新元素的样式时v-bind可以绑定class也可以绑定style。

11.事件修饰符中.self只会触发自己范围内的事件不包含子元素。

13.表单中文本输入框可以用v-model指令将数据绑定到value属性。

literal)、数组字面量(array

17.Vue实例对象中通过components选项来局部注册组件。

20.父组件也可以通过children访问它所有的子组件中的数据。

1.父组件可以使用this.refs子组件索引来获取或修改组件数据。

2.slot元素可以用一个特殊的属性name来配置如何分发内容

3.在向具名插槽提供内容的时候也可以在一个template元素上使用v-slot指令。

4.v-slot:slot1可以用语法糖写成#slot1(类似于v-on:click,语法糖click)。

transition

clickisOff!isOff{{isOff?Off’:On}}/button

/transition

15.完善代码使得transition组件在example1和example2之间切换。

body

clickcompontentNameexample1登录/a

hrefjavascript:;

clickcompontentNameexample2注册/a

transition

Vue.component(‘example1,{template:’#example1})

var

16.Nodejs是一个基于ChromeV8引擎的JavaScript运行环境采用了单线程、非阻塞IO事件驱动式的程序设计模式。

17.Node.js非常适合于cpu密集型应用如多人在线聊天、多人在线小游戏、实时新闻、博客、微博等。

不适用于io密集型应用如高性能计

18.Nodejs安装是否正常可以使用node-v命令来检查如果出现版本号说明安装正确否则未完成安装。

19.Node.js中根据模块来源的不同将模块分为了3大类分别是原生模块、

install

5.利用脚手架创建项目vueinittemplate-nameproject-name中template-name指的是模板名称。

6使用vue

7.使用vue-cli2.x命令行工具创建Vue项目myproject命令是vue

init

8.使用vue/cli3.x版本创建Vue项目myproject的命令是vue

create

‘vue-router则使用VueRouter的正确语句是Vue.use(Router)

11.设置动态路由匹配时需要在路由中path属性上使用“”来连接动态路径参数。

12.当匹配到动态路由时动态路径参数被保存在this.$route对象的params中。

13.每条路由route通常包含2个基本属性分别是path、component属性当然也可以设置name、children等。

import

15.在命名路由中如果router-view没有设置名字那么默认为default。

16.重定向也是通过routes配置redirect属性来完成。

17.完善下列代码设置路由为历史模式

18.script标记中配置路由包含定义/导入路由组件、定义路由、创建路由实例和传入路由表参数等几个部分。

storenew

vuex-1方法创建项目后必须在当前目录下安装vuex并且将安装信息写入到开发依赖中的命令是npm

install

2.Vuex中的mutation非常类似于事件每个mutation都有一个字符串的事件类型和一个回调函数(handller)。

4.在Vuex配置选项中其中modules选项用来在store实例中定义模块对象。

5.存储在Vuex的状态中数据一旦发生变化所有的组件或实例中的数据都会同步更新所以说Vuex的状态存储是响应式的。

6.改变store中的状态的唯一途径就是显式地提交mutation。

7.Vuex为批量获取getters提供的辅助函数是mapGetters()。

8.Vuex应用的核心就是store仓库。

store就是一个容器它包含着用户应用中大部分的状态。

9.在Vue2.x中使用newVue(0)方式来创建实例而在Vue3.x中则使用createApp()创建组件实例(id为app)

10.ref()函数接收一个参数值返回一个响应式数据对象该对象只包含一个指向内部的value属性。

import

13.在Vue3.0中可以使用ref引用DOM元素和组件实例。

15.Vue3中的watch函数可以用来懒情地执行监听数据源并且可以监视状态的先前值和当前值。

const

history.createWebHistory(process.env.BASE_URL),

Routes

双向数据绑定是指在前端开发中数据模型和视图之间的相互关联和自动同步。

当数据模型的值发生变化时视图会自动更新反之视图中的用户输入或变化也会同步更新到数据模型中。

Vue

MVVM模型中Model、View以及ViewModel分别指什么

Model负责数据和业务逻辑View是用户界面负责展示数据和接收用户输入而

ViewModel

MVVM在计数器案例中哪个体现了ModelView以及ViewModel

ViewModel分离view和model又能实现程序逻辑methods中定义的functionadd和sub

Vue中的组件将大型应用程序拆分成多个可复用的模块每个模块具有独立的功能和样式。

通过封装相关的模板、逻辑和样式组件帮助开发者管理复杂的用户界面同时支持灵活的数据传递。

组件包含HTML模板、CSS

样式和JavaScript脚本使代码更加模块化提升了可维护性和开发效率。

参考版

const为块作用域仅在声明它们的代码块内有效。

var为函数作用域或全局作用域。

2const和let没有变量提升且定义的变量只在let命令所在的代码块生效在定义之前使用会报错。

var变量会被提升在全局范围内都有效且可在变量定义之前使用。

3const和let在同一作用域内不能重复声明同一个变量。

var允许重复声明。

4let

和var可以只声明不赋值。

const只能定义一个常量定义后不能再改变不允许只声明不赋值。

5为了安全大部分情况下var可以用let来替代,尤其是for循环中定义循环变量使用let可以避免变量污染。

定义常量使用const。

rest

1rest参数只包括那些没有给出名称的参数arguments包含所有参数

map,

箭头函数this为外部作用域定义时所在的上下文的this不是调用时的this。

箭头函数通过call和apply调用不会改变this指向只会传入参数。

1.共同点

1性能消耗v-if有更高的切换开销v-show有更高的初始渲染开销。

2渲染方式v-if是基于条件进行的“惰性渲染”即只有在条件为真时才会渲染对应的组件或元素而在条件为假时会直接移除对应的组件或元素。

v-show则是通过css的display属性来控制元素的显示和隐藏。

使用vue时html标签怎么绑定事件

原理v-model本质上是一个语法糖。

例如应用在输入框上就是value属性和input事件的合写。

数据变视图跟着变

vue自定义指令如何实现的它有哪些钩子函数还有哪些钩子函数参数

定义方式全局定义指令在vue对象的directive方法里面有两个参数一个是指令名称另外一个是函数。

组件内定义指令directives

钩子函数

beforeMount当指令第一次绑定到元素并且在挂载父组件之前调用。

指令

beforeUpdate指令所在组件的VNode更新之前调用。

Unmounted只调用一次、指令与元素解绑且父组件已卸载时调用。

el:

(1)执行顺序上有一些细微差别dom加载完成后将立即执行计算属性computed再执行watch。

(3)watch是更通用的响应数据变化的属性如果数据变化是异步的用watch较合适而计算属性适合做筛选不可异步。

(4)计算属性在调用时需要在模板中渲染修改计算所依赖元数据而watch在调用时只需修改元数据。

(6)计算属性computed需要返回值watch不需要返回值。

(7)计算属性computed的值不能在data中定义watch需要在data中定义。

(1)使用自定义组件时要先注册当前组件Vue.component(component-name,Component)。

同时在组件中定义props接受父组件数据。

(2)在自定义表单组件中加入v-model进行创建双向数据绑定。

(1)直接在组件上使用class、:class或v-bind:class如果组件有多个根元素可以用$attrs指定。

(3)v-bind:class传递一个数组应用一个class列表。

Vue

必须是一个函数因为每个组件实例都应该拥有独立的数据状态。

使用函数返回数据对象的方式可以确保每个组件实例都有其自己的数据副本防止数据共享和相互污染。

props

将数据传递给子组件子组件接收并渲染这些数据但子组件不能直接修改父组件的数据。

如果子组件需要修改数据它必须通过自定义事件$emit来通知父组件然后由父组件来修改数据。

这确保了数据流的可维护性和可追踪性使应用更易于理解和调试。

在选项式API中组件逻辑是按照data、methods、computed、watch等分块写的这种分离可能会导致相同功能的代码分散在不同的部分。

组合式API

通过将相关的逻辑组合在一起使代码更加紧凑和清晰尤其实在复杂组件中组织代码的方式更加自然。

在选项式API中如果要复用逻辑通常使用mixin但mixin存在作用域不清晰、命名冲突等问题。

组合式API提供了composable

可组合函数的概念运行将逻辑抽取成独立的函数这样复用性更强、代码更清晰。

组合式API更好地支持TypeScript尤其是在函数内部可以更明确地推断出数据和函数的类型而不需要额外的类型定义。

组合式API

提供了更灵活的响应式系统比如通过ref和reactive可以更直观地控制响应式数据的行为。

props

向父组件发送事件父组件通过监听该事件来接收数据。

在子组件中使用

defineEmits

事件时父组件会相应地更新数据或删除书籍。

这种模式实现了父子组件的双向交互并保持了组件的解耦。

为什么在抽取的组合式API中为什么数据会多用ref或reactive

Vue

确保响应式它们可以让数据变得响应式当数据变化时视图会自动更新。

在Vue.js

址匹配相应的路径并加载对应的组件。

通过路由配置可以定义每个路径对应

的组件而组件则负责渲染页面内容和处理交互。

路由和组件的配合使得Vue

应用能够在不同的页面之间导航和动态更新视图确保每个URL显示特定的页

router-link和router-view各自起到什么作用

在Vue.js中router-link用于创建导航链接点击时根据路由配置跳转到对

应的页面router-view是一个占位符组件负责渲染与当前路由匹配的组件。

router-link触发路由跳转router-view显示对应的视图组件两者共同

在Axios中请求拦截器在请求发送之前进行必要操作处理比如为每个请求带

上响应的参数token时间戳等。

响应拦截器在请求响应之后对响应体的处

理通常是数据统一处理也常用来判断登录失效token是否过期。

通过这

两个拦截器可以减少代码重复、增强请求的灵活性并提升应用的可维护性。

sessionStorage

SessionStorage中的数据仅在当前浏览器会话期间有效也就是说数据会在浏览器或标签页关闭时被清除。

LocalStorage中的数据则是持久存储的即使浏览器关闭数据也不会消失除非用户手动清除或通过代码删除。

(2作用范围

的数据仅对当前浏览器窗口或标签页有效不同的窗口或标签页之间无法共享数据。

LocalStorage

中的数据可以在同一域名下的所有页面中共享和访问适用于不同页面之间的数据传递。

(3适用场景

SessionStorage适用于存储临时数据如表单填写信息、会话状态等这些数据仅在当前浏览器会话期间有效。

LocalStorage适用于存储长期有效的数据如用户偏好设置、主题选择等适合需要跨页面、跨会话保存的数据。

1.mutations

(1Vuex和Pinia默认情况下都不会将数据存储在sessionStorage

或localStorage中。

它们的默认存储是存在内存中的它们的状态会在页面刷新后丢失。

vuex-persistedstate

sessionStorage插件默认存放数据在localStorage,也可以通过配置更改存储位置。