vue中 sessionStorage.setItem

通过sessionStorage.setItem('name',item.name)存储item.name

利用sessionStorage.getItem('name')获取存储数据

想要在页面中展示所获取到的数据

const liName=sessionStorage.getIt('liName')

<span>{{liName}}</span>

这样写页面没有将liName展示出来

求教求教!!!!

sessionStorage.setItem('name',"99999")

let a=sessionStorage.getItem("name");

console.log(a) //a有值吗，有的话就是你赋值有问题

我这样写没问题

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
   <span id="text">
   </span>
</body>
<script>
   sessionStorage.setItem('name',"99999")
   let a=sessionStorage.getItem("name"); //vue里在data里声明一个变量text然后this.text=a; 使用就是{{text}}
   console.log(a);
   let text=document.getElementById("text");
   text.innerText=a;
</script>

</html>

vue 这种情况下无法检测到双向绑定的，每次都要手动获取新值在去赋值

要放到data的变量里面才可以这样显示的

export default {
    name: "myComponent",
    created() {
        this.liName = sessionStorage.getItem("custId") ||  "张三";
    },
    data() {
        return{
          liName: ""
        }
    }
}

这样写试一下

通过sessionStorage.setItem('name',item.name)存储item.name

利用sessionStorage.getItem('name')获取存储数据
// 你存的关键字段是name,取出来的字段却是liName,还有是sessionStorage.getItem，不是sessionStorage.getIt

const liName=sessionStorage.getIt('liName')

改成

const liName=sessionStorage.getItem('name')