大佬教程收集整理的这篇文章主要介绍了'无法读取未定义的属性'set''错误'this.$cookies.set'，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我正在尝试为我的 Vue 项目设置一些基本的 cookie，但在尝试设置 cookie 时遇到了标题错误。根据我的 package.Json 文件，我正在使用 vue-cookies 版本 ^1.7.4。当我点击我的按钮制作 cookie 时，完整的错误信息如下：
ncaught TypeError: CAnnot read property 'set' of undefined
at Proxy.setcookie (VM6493 Register.vue:45)
at Object.onClick._cache.<computed>._cache.<computed> (Register.vue?db27:29)
at callWithErrorHandling (runtime-core.esm-bundler.Js?5c40:154)
at callWithAsyncErrorHandling (runtime-core.esm-bundler.Js?5c40:163)
at HTMLbuttonElement.invoker (runtime-dom.esm-bundler.Js?830f:333)
setcookie @ VM6493 Register.vue:45
Object.onClick._cache.<computed>._cache.<computed> @ Register.vue?db27:29
callWithErrorHandling @ runtime-core.esm-bundler.Js?5c40:154
callWithAsyncErrorHandling @ runtime-core.esm-bundler.Js?5c40:163
invoker @ runtime-dom.esm-bundler.Js?830f:333
带有 cookie 设置按钮的页面是这个 Register.vue 文件：
<template>
<layout>
<button v-on:click="setcookie()">Click For cookie</button>
</layout>
</template>
<script>
import Layout from "./components/Layout";
import axios from "axios";
export default {
name: "Home",components: {
Layout,vlink
},data: () => {
return {
username: "",}
},methods: {
setcookie() {
this.$cookies.set("username","bilbobaggins")
}
}
}
</script>
<style scoped>
</style>
导航到 Register.vue 页面时收到此警告：
[Vue warn]: Extraneous non-props attributes (install,config,get,set,remove,isKey,keys) were passed to component but Could not be automatically inherited because component renders fragment or text root nodes.
at <Layout install=fn<install> config=fn<config> get=fn<get> ... >
at <Home install=fn<install> config=fn<config> get=fn<get> ... >
at <App install=fn<install> config=fn<config> get=fn<get> ... >
这是我的 main.Js 文件：
import {CreateApp,h} from 'vue'
import App from './App.vue'
import Register from "./Register"
import "./vue-API-call/styles.CSS"
import Vuecookies from 'vue-cookies'
const routes = {'/': App,'/register': Register}
const SimpleRouter = {
data: () => ({
currentRoute: window.LOCATIOn.pathname
}),computed: {
CurrentComponent() {
return routes[this.currentRoute]
}
},render() {
return h(this.CurrentComponent)
}
}
createApp(SimpleRouter,Vuecookies).mount("#app")
我尝试在导入后将 Register.vue 文件中的函数从“this”更改为“window”或“Vuecookies”，但没有奏效。我还尝试了不同的方法来“.使用”main.Js 文件中的 Vuecookies 模块，但是，我要么不擅长，要么不是问题。任何帮助，将不胜感激。谢谢！
编辑：刚刚尝试在我的 Register.vue 文件的脚本部分导入 vue-cookies 并将函数更改为 Vuecookies.Vuecookies.set("username","bilbobaggins") 但是，这给出了相同的错误消息。
显然 vue-cookie 模块不适用于 Vue 3，因为 install 函数使用 Vue 2 版本 Vue.prototype.$cookie 使其可用于所有组件。 Vue.prototype 在 Vue 3 (https://v3.vuejs.org/guide/migration/global-api.html#vue-prototype-replaced-by-config-globalproperties) 中现在是 Vue.config.globalProperties。这仍然是 vue-cookie 模块 GitHub 存储库中的一个悬而未决的问题：https://github.com/cmp-cc/vue-cookies/issues/59。
如果您使用的是 Vue 3，那么您需要转到 vue-cookies 节点模块并进行更改：
install: function (VuE) {
Vue.prototype.$cookie = this;
Vue.cookie = this;
},为此：
install: function (VuE) {
Vue.prototype ? Vue.prototype.$cookies = this : Vue.config.globalProperties.$cookies = this;
Vue.cookie = this;
},LittleWhiteLoti 提供了这个修复，所有功劳都归功于他们：https://github.com/cmp-cc/vue-cookies/issues/59#issuecomment-823796719
以上是大佬教程为你收集整理的'无法读取未定义的属性'set''错误'this.$cookies.set'全部内容，希望文章能够帮你解决'无法读取未定义的属性'set''错误'this.$cookies.set'所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。