javascript - 如何在定义sessionStorage key 时使用ES6模板文字

我正在尝试使用ES6模板文字语法来设置sessionStorage，其中部分键是活动选项卡ID。

我首先尝试将ES6模板文字放入方法中：

sessionStorage.getItem(`tabContent + ${this.props.activeTabKey}`)

但这不会编译。

接下来，我在我的方法中创建了一个常量，然后在sessionStorage方法中对其进行了引用：

//attempt 1
const activeTabSessionStorageName = `tabContent + ${this.props.activeTabKey}`
(sessionStorage.getItem(`${activeTabSessionStorageName}`))

// attempt 2

const activeTabSessionStorageName = `tabContent + ${this.props.activeTabKey}`

  sessionStorage.getItem(JSON.stringify(activeTabSessionStorageName))

//attempt 3
const activeTabSessionStorageName = `tabContent + ${this.props.activeTabKey}`
(sessionStorage.getItem(this.activeTabSessionStorageName))

我不确定正确的语法是什么，但是都失败了，并出现了错误：

 SyntaxError: Unexpected token u in JSON at position 0

我的目标是要有一种方法可以动态检查存储，以查看它们的键是否存在，然后设置是否不存在。

除了高级理解之外，我对sessionStorage并不那么熟悉。我知道键和值必须是字符串。

我正在使用React和Redux

最佳答案

Your error is likely a result of attempting to JSON.parse() an undefined value.

可以将window.sessionStorage与JSON.stringify()和JSON.parse()组合以提交会话数据。

请参见下面的实际示例，包括Template Literals和未找到sessionStorage Item的情况下的安全转义。

// Hypothetical Object.
const hypotheticalObject = {
  id: 'unique id',
  data: 'data ..'
}

// Set Object to Session Storage.
window.sessionStorage.setItem(`CONTENT + ${hypotheticalObject.id}`, JSON.stringify(hypotheticalObject))

// Get Object.
const retrievedObject = window.sessionStorage.getItem(`CONTENT + ${hypotheticalObject.id}`) && JSON.parse(window.sessionStorage.getItem(`CONTENT + ${hypotheticalObject.id}`)) || false

// Log.
console.log(retrievedObject)

关于javascript - 如何在定义sessionStorage key 时使用ES6模板文字，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49020293/