首先在子组件将localstorage方法进行封装

在父组件中对其进行引用

将输入的值存入到定义的searchHistory数组中,存储localstorage需要传两个参数,变量名为searchHistory,值为searchHistory的数组,调用封装好的setStore方法

将存储到localstorage的值,取出来

做的是一个搜索,将localstorage显示出来了

vue中操作localstorage的更多相关文章

  1. vue中使用localStorage存储信息

    一 什么是localStorage 对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:localStorage 和 sessionSto ...

  2. 在vue中操作dom元素

    在vue中可以通过给标签加ref属性,就可以在js中利用ref去引用它,从而达到操作该dom元素,以下是个参考例子 1 <template> 2 <div> 3 <div ...

  3. vue中操作Dom节点的方法

    1.vue中ref操作dom节点 <template> <div id="app"> <div </div> <button @cl ...

  4. 在vue中操作DOM--this.$nextTick()

    虽然 Vue.js 通常鼓励开发人员沿着"数据驱动"的方式思考,避免直接接触 DOM,但是有时我们确实要这么做.比如一个新闻滚动的列表项.如果在这里需要操作dom, 应该是等待 V ...

  5. vue中使用localstorage

    1.store.js(读取写入到localstorage) const STORAGE_KEY="todos-vuejs" export default{ fetch(){ ret ...

  6. vue中操作cookie的插件

    js-cookie 安装: npm i js-cookie import Cookies from 'js-cookie' 具体用法: 写入: Cookies.set('name', 'value') ...

  7. Vue中获取dom元素

    Vue.js虽然说是数据驱动页面的,但是有时候我们也要获取dom对象进行一些操作. vue的不同版本获取dom对象的方法不一样 Vue.js  1.0版本中,通过v-el绑定,然后通过this.els ...

  8. Vue中通过Vue.extend动态创建实例

    Vue中通过Vue.extend动态创建实例 在Vue中,如果我们想要动态地来控制一个组件的显示和隐藏,比如通过点击按钮显示一个对话框或者弹出一条信息.我们通常会提前写好这个组件,然后通过v-if = ...

  9. 第七十六篇:ref引用(在vue中引用Dom的方法)

    好家伙, 引子: jQuery简化了程序员操作DOM的过程 vue 优势:MVVM 在vue中,程序员不需要操作DOM.程序员只需要把数据维护好即可!(数据驱动视图) 那么若要在vue中操作dom,这 ...

随机推荐

  1. 005-OpenStack-网络服务

    OpenStack-网络服务 [基于此文章的环境]点我快速打开文章 1.控制节点(controller) 1.1 创库授权 neutron mysql CREATE DATABASE neutron; ...

  2. Paxos算法—前世

    Paxos算法是基于消息传递且具有高度容错特性的一致性算法.我们将从一个简单的问题开始,逐步的改进我们的设计方案,最终得到Paxos,一个可以在逆境下工作的协议. 一.客户端-服务器模型 我们从最小的 ...

  3. SDL2学习(二):常用枚举值和函数

    1. 高频枚举值或结构体 1.1 SDL_WindowFlags /** * \brief The flags on a window * * \sa SDL_GetWindowFlags() */ ...

  4. mysql使用记录

    1. 报错 10061 将mysql启动即可

  5. Codeforces Round 573 (Div.1) 题解

    这场怎么说呢……有喜有悲吧. 开场先秒了 A.看到 B,感觉有点意思,WA 了 2 发后也过了. 此时还在 rk 前 200. 开 C,一看就不可做.跟榜,切 D 人数是 C 的两倍. 开 D.一眼感 ...

  6. [LeetCode] 6. ZigZag Conversion 之字型转换字符串

    The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows like ...

  7. 姿态角(RPY)的优化目标函数

    在Pose-Graph的过程中,如果使用G2O优化函数库,那么似乎是不用自己编写代价函数(也就是优化目标函数)的,因为G2O有封装好的SE3等格式,使得Pose-Graph的过程变得简单了,即只需要设 ...

  8. java web开发入门七(mybatis)基于intellig idea

    mybatis 一. 入门开发步骤 1.导入相关jar包 mybatis3.4.2核心开发包 asm-5.1.jarcglib-3.2.4.jarcommons-logging-1.1.3.jarlo ...

  9. python脚本生成exe程序

    去年十一月换了新公司后,一直没闲着,马不停蹄地接不同的需求,一个版本一个版本的迭代,也没时间研究python了.十一休假归来,某日,老婆问金融量化需要学python吗?并分享了一个公众号文章,内容是吹 ...

  10. 2018-2019-2 20162329 《网络对抗技术》Exp8: Web基础

    目录 Exp8: Web基础 一. 基础问题回答 1. 什么是表单 2. 浏览器可以解析运行什么语言. 3. WebServer支持哪些动态语言 二. 实验过程 1. Web前端HTML 2..Web ...