there is a problem, do not save the array as a JSON object, your problem may have something to do with this, I have not tried v-for can traverse the object. According to js syntax, you for-in traverses key instead of value . Secondly, when there is a strange problem, your first reaction should be to print out the strange data-you do print it, but only at the back end, not at the front end, and the part where you have the problem seems to be at the front end.
the reason for your second problem is that you did not use sessionStorage correctly, and the session storage is also key-value structure. From your screenshot, you set the key of a record to "A classmate", value is set to an empty string, and there is no name key , of course, there will not be An in span . For specific usage, please refer to the tutorial of w3cschool.
< hr >
looking at the description of the subject, I guess you jumped to the page and then saved something in sessionStorage ? Or should I save something in sessionStorage and then jump to the page? I have tried the latter, which does not cause storage problems. Look at the code of the main post sessionStorage.setItem ('name',res.data.sname); . If this operation is completed normally, you must store key as " name " and value as a record of the value of res.data.sname , such as
in
sessionStorage .
sessionStorage.setItem('test', 'Rua');
sessionStorage.getItem('test');
// "Rua"
although the subject has found a way to obtain "classmate A", it does not fundamentally solve the problem. I still hope that the subject can first confirm that the function of sessionStorage is normal and that his usage is correct.
1. Take a screenshot to see what the value taken by the front end is
2. When setting sessionStorage.setItem ('name',' A classmate') , you can take the value as you wrote. sessionStorage.getItem ('name')
1. It's not an array. You can't loop without length,.
I can't use var stuname = [] as an array
it's OK to make an array, you can post the code you changed into an array, or give the data you get.
2. Of course, you can't get it without setItem , and you generally don't need sessionstorage , because when the browser opens a new tab, sessionstorage is not shared. Of course, this may also be your requirement.
<ul><li v-for = "item in data">{{ item }}</li></ul>
data (){
return{
data: ''
}
},
mounted() {
var that = this;
this.$ajax.post('http://localhost:3000/get-name', this.$qs.stringify({
})).then(res => {
that.data = res.data;
})
}
this item is like this.
{'0':'A','1':'B','2':'C'}
if you want to show it, it should be OK to write like this
<ul>
<li v-for = "item in data">
<span v-for = "(value, key) in item">{{value.key}}</span>
</li>
</ul>
then comes your storage problem
data (){
return{
name: sessionStorage.getItem('name')
}
}
<span class="st-name">{{ name }}</span
from your screenshot, the key of your sessionStorage is' classmate A', and the value is empty. If you want to fetch classmate A, name should pass the variable, not the string 'name'.
name: sessionStorage.getItem('name')
Change
to
var key = 'A';
var name = sessionStorage.getItem(key);
