Question

在项目上运行npm run dev时，webpack cmd窗口中出现错误。

这是我得到的代码和错误消息，与父顶级Vue组件相关的代码，该组件具有导航栏，其中的详细信息取决于用户是否登录：

代码

<script>
// import required components
import EventBus from './components/EventBus'
import router from './router/index.js'
import jwtDecode from 'jwt-decode'

export default {
  data () {
    const token = localStorage.usertoken
    const decoded = jwtDecode(token)
    return {
      first_name: '',
      surname: '',
      email: '',
      created: ''
    }

    return {
      auth: false
    }

    try {
      this.login()
    } catch (error) {
      console.log('Not currently signed in')
    }
  },

  methods: {
    logout () {
      this.first_name = ''
      this.surname = ''
      this.email = ''
      this.created = ''
      localStorage.removeItem('usertoken')
      this.auth = false
      router.push({
        name: 'login'
      })
    },

    login () {
      this.first_name = this.decoded.f_name
      this.surname = this.decoded.s_name
      this.email = this.decoded.email
      this.created = this.decoded.created
    }
  },

  mounted () {
    EventBus.$on('logged-in', status => {
      this.auth = status
      this.login()
    })
  }
}
</script>

错误消息

  ✘  http://eslint.org/docs/rules/no-unused-vars  'decoded' is assigned a value but never used
  src\App.vue:60:11
      const decoded = null

在我看来，decoded中使用了login()，有什么想法吗？

Answer 1

您需要更改数据方法

由于您的数据是函数，因此公开的是返回值。您需要从data（）返回已解码，以便在登录方法中使用已解码。

 data () {
        const token = localStorage.usertoken
        const decoded = jwtDecode(token)
        return {
          first_name: '',
          surname: '',
          email: '',
          created: '',
          decoded: decoded
        }

变量分配了一个值，但在Vue数据对象中声明它并在方法中使用它时从未使用过

1 个答案: