提交后，数据变量在Vue中变得未定义
在Vue中，当提交后数据变量变为未定义的情况可能是由于以下几个原因导致的：
- 数据未正确绑定：在Vue中，数据绑定是通过将数据对象绑定到Vue实例的data属性上实现的。如果在提交后数据变量变为未定义，可能是因为数据对象未正确绑定到Vue实例上。请确保在Vue实例的data属性中正确定义了数据对象，并在模板中使用正确的语法进行数据绑定。
- 数据未初始化：如果在提交后数据变量变为未定义，可能是因为数据对象未正确初始化。请确保在Vue实例的created或mounted钩子函数中对数据对象进行初始化，以确保数据对象在提交前已经被正确赋值。
- 数据作用域问题：在Vue中，数据对象的作用域是有限的，如果在提交后数据变量变为未定义，可能是因为数据对象的作用域超出了其定义的范围。请确保在提交操作中使用正确的作用域访问数据对象，避免超出其定义的范围。
- 异步操作问题：如果在提交后数据变量变为未定义，可能是因为提交操作是异步执行的，而在提交操作完成之前，数据对象已经被销毁或未正确赋值。请确保在异步操作中正确处理数据对象的赋值和销毁，以避免数据变量变为未定义。
总结起来，当提交后数据变量在Vue中变得未定义时，需要检查数据绑定、数据初始化、数据作用域和异步操作等方面的问题，确保数据对象在提交前已经被正确赋值并且作用域正确。如果问题仍然存在，可以进一步检查代码逻辑和调试错误信息，以找到并解决问题。
关于Vue和云计算领域的相关知识，腾讯云提供了一系列的产品和服务，例如云服务器、云数据库、云存储等，可以满足不同场景下的需求。具体的产品介绍和相关链接可以参考腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
Vuex吸气剂未定义
、、、
我是Vue.js的新手，经历了Vuex模块和Axios的问题。我有一个"post“组件，它从路由器检索一个片段，然后用Axios获取数据，然后用Vuex Getters检索数据。
我能够成功地检索数据，但是在我的DevTools，"TypeError:无法读取未定义的“的属性'name‘上仍然看到了这个错误
由于这个错误，我无法将this.post.name传递给Vue-Meta。
码
Post.vue
computed: {
...mapGetters(["post"]),
},
mounted() {
const slu
浏览 0提问于2020-06-15得票数 2
回答已采纳
我使用的是Vue 2.0，我有一个错误
(未定义的ReferenceError: vm未定义)
当我使用vm.$data或控制台中的任何其他东西来检查属性时。我有最新版本的vue.js 2.2.4。
浏览 3提问于2017-03-14得票数 6
2回答
我让data.js导入axios和VueAxios，如下所示：
当我在mutations(vuex)中调用mutations(vuex)函数时，返回未定义的。但是，当我做控制台日志时，它会返回正确的数据集。
import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios)
let BASE_URL = 'http://localhost:3000'
const API_URL = `
浏览 3提问于2018-06-24得票数 1
回答已采纳
知道我将如何使用这个插件吗？
我看到它是自动注册的vue，但我不能在nuxt中使用它。
我创建了plugins/vue-json-rpc-websocket.client.js，在nuxt.config.js中注册为
'~/plugins/vue-json-rpc-websocket.client.js'
但是，我不知道如何在inject方法中编写，也不知道是否必须这样做才能使它工作。this.$socket在组件中未定义。
import Vue from 'vue'
import JRPCWS from 'vue-json-rpc-websocket&
浏览 14提问于2021-04-30得票数 1
回答已采纳
我在这方面的斗争已经太久了。Vue引发未定义名称的错误。它不是从一开始就定义的，而是在Vue创建时被定义的。
clients.php
<input type="text" v-bind:value="customers[<? echo $this->client['id'];?>].name">
应用程序数据
var app = new Vue({
el: '#app',
data: {
customers: {},
}
})
app.js
created: function(){
浏览 1提问于2017-05-03得票数 2
我用vue-cli和一起创建了一个应用程序，它工作得很好。在中，我将new Vue(...行更改为var vm = new Vue(...，以便可以从Chrome控制台访问Vue实例，但变量vm仍然显示为未定义。
对我来说，获得Vue对象引用的正确方法是什么，这样我就可以手动生成组件中的事件，或者从控制台手动修改数据了？
浏览 2提问于2017-01-24得票数 5
回答已采纳
您好，我试图将根数据传递给我的组件，我有3种类型的数据。它们中的两个都是有效的，它们都有相同的代码，但我的一个数据在我的道具中是未定义的。这是样例 <my-component v-for="(meat, index) in meats" :key="meat.id" :index="index"></my-component>
---vue script----
Vue.component('my-component', {
props:['index', 'meat
浏览 31提问于2019-03-16得票数 0
回答已采纳
我正在转换一个ASPX页面到vue。所有的vue组件都被正确加载了，我也得到了refs对象
`<test-report ref="testReport" ></test-report>
<script>
method:{
Loaded:{
this.objResult = this.refs.testReport
}
},
`
但是在提交ASPX页面后，我需要在vue组件中显示一些其他数据，但refs对象显示未定义。我需要在该对象内部调用另一个函数，但它显示为undefined。
`<script>
method
浏览 0提问于2019-09-26得票数 0
我试图使用tableTop.js从电子表格构建一个对象数组，这些对象可以传递到其他函数和vue组件中。我一直未能归还任何我可以实际使用的东西。使我接近我所追求的，然而它正在返回的是一个对象数组数组，其中包含两个未定义的数组项，以ob：开头。
如果我在getLibrary()函数中注销数据，我可以看到正确的数组是如何在组件中接收数据的。
如果不将数据推入gData数组中的libraryData中，就会从函数接收vue中未定义的数据。我曾经尝试过承诺，正常的功能等等，但似乎没有任何效果。非常感谢任何人能提供的任何帮助。
图1是我在vue中尝试接收的库数据中注销的内容。
图2是我在vue中得到的
l
浏览 4提问于2019-02-13得票数 0
回答已采纳
我的vue版本: 2.1.10
Vue警告
呈现错误："TypeError:无法获得未定义或空引用的属性“
(在Root>中找到
TypeError:无法获得未定义或空引用的属性“Product”
Vue警告
属性或方法"*this*“不在实例上定义，而是在呈现过程中引用。通过初始化此属性，确保此属性是反应性的，无论是在data选项中，还是对于基于类的组件。见：。
(在Root>中找到)
Vue警告
呈现错误："TypeError:无法获得未定义或空引用的属性'order_id‘“
(在Root>中找到
浏览 0提问于2018-09-29得票数 1
有时，我需要把数据从我的控制器传递到视图，有时我不！但是，当没有数据传递时，我会得到以下错误：
未定义变量:教程(View: /var/www/html/resources/View/html.blde.php)
无数据示例：
public function index()
{
return view('home');
}
配置数据示例
public function tutorial()
{
return view('home', ['tutorial' => 'Welcome to myproject, le
浏览 4提问于2019-11-19得票数 1
回答已采纳
2回答
我正在做一个项目，并使用Vue.js作为前端。我在main.js文件中有以下代码。
new Vue({ // eslint-disable-line no-new
//el: '#app',
router,
data () {
return {
friends: []
}
},
methods: {
getFriends: function () {
return this.friends;
}
},
created: function () {
this.$http.get('/user/
浏览 0提问于2017-04-10得票数 2
回答已采纳
我正在学习currentDashboard，所有从Vue.JS数据表达式引用仪表板属性的尝试都会导致“仪表板未定义”。Vue是在currentDashboard仪表板之前对表达式进行某种程度的评估，还是需要一些限定符来引用它，这没有帮助？
vue = new Vue({
el: '#dashboard',
data: {
dashboards: store.getDashboards(),
currentDashboard: dashboards[0],
}
})
浏览 0提问于2018-07-02得票数 6
我正在尝试获取ag-grid行数据，以便在模式窗口中进行编辑。在渲染过程中，vue通过下面的错误。
Vue warn:装入钩子时出错："TypeError:无法读取未定义的属性'data‘“
我的代码。这是挂载的方法。
mounted() {
this.leadsData = JSON.parse(JSON.stringify(this.params.data))
},
浏览 2提问于2020-04-29得票数 0
1回答
我有一个Vue对象列表，如下所示：
vue_objectname0，
vue_objectname1，
vue_objectname2等..。
这些物体是由下列机构创建的：
var vue_objectname0 = new Vue({
el: '#vue_objectname0',
data: {
seen: true,
}
})
通过浏览器控制台，我可以正确地访问数据：
vue_objectname0.seen
现在我需要访问与对象名称相同的字符串数据，如何将字符串转换为对象？
var name = "vue_objectname"
浏览 0提问于2018-04-10得票数 0
回答已采纳
2回答
我正在使用Vue.extend手动地将一个组件挂载到一个动态元素，如下所示：
import Vue from 'vue';
import MyComponent from 'MyComponent.vue';
const MyComponentConstructor = Vue.extend(MyComponent);
const MyComponent = new MyComponentConstructor({
propsData: {
foo: 123,
},
}).$mount('#mount-point'
浏览 1提问于2017-06-09得票数 11
回答已采纳
我试图通过调用Vue js中的方法属性中的函数来填充在data属性中声明的数组。以下是代码：
<script>
export default {
extends: Bar,
mounted() {
this.renderChart(this.chartData, this.options);
this.fillLabel();
},
data() {
return {
chartData: {
labels:[],
datasets: [
{
label:
浏览 2提问于2020-03-25得票数 1
回答已采纳
2回答
我目前正在使用vue数据报警器，当选择日期时，它在vue developer工具中显示pickedValue作为所选日期的值：
<div v-cloak v-if="isScheduledTask">
<datepicker value="" name="pickedValue" id="pickedValue" ></datepicker>
</div>
尝试将pickedValue设置为数据返回中的变量(这里需要将选定的值与其他数据一起提交)，因为$ref
浏览 2提问于2019-08-23得票数 0
回答已采纳
1回答
你好，，#Vue.js2，我在创建一个表单提交事件中调用的函数时遇到了一个问题，这个函数需要接受两个参数：事件和 id 。我现在的问题是，当我调用这个函数时，我无法在没有错误的情况下指定事件param，所以我的格式数据和id在日志中将是未定义的。有更好的方法来处理我的表格吗？
updatePost(event, id) {
const postId = id;
const updatedPost = new FormData(event.target); // Any way to not use event param to save this ?
console.log(
浏览 3提问于2022-03-21得票数 2
回答已采纳
2回答
为什么当我使用Vue.component加载下面的两个注释组件时，当它与import一起工作时，会在javascript控制台中得到以下错误？
未定义的ReferenceError:仪表板未定义
app.js
Vue.component('left-menu', require('./components/LeftMenu.vue').default);
// Vue.component('dashboard', require('./components/foo/dashboard.vue').default);
// Vue
浏览 0提问于2020-04-19得票数 0
回答已采纳
因此，我将数据从父组件传递给子组件，并在子组件中显示它。一切都很好，但是当我去consol时，我发现我在那里有问题，尽管代码运行得很好，显示的数据也是我所期望的。
父亲部分：
<article-header :article="articles"></article-header>
这一行位于<template>标记中。项目变量是在API后端http请求中收集的值。
在子组件(即<article-header> )中，我使用以下数据：
<template>
<p>{{ article[0].title }}
浏览 1提问于2017-12-07得票数 1
回答已采纳
1回答
我在数组(mySplitDayssplitDayIndex=splitDay)上发送了我的数据，但是我有一个错误.
components: { VueCal },
data() {
return {
users:[],
mois:[],
assignments:[],
selectedEvent: {},
showDialog: false,
events: [],//recuperer tache ici
minCellWidth: 400,
minSpli
浏览 3提问于2019-10-09得票数 0
回答已采纳
2回答
摘要：显示从API中获得的一些数据。由于调用的异步性和不同的刷新速率，我不能假设当我从Vue代码调用它时，Vue对象中的Vue是可用的。有办法处理Vue.js?中丢失的数据吗？
详细信息：
以下代码工作(输出hello world)，因为message.text是在编译Vue实例期间定义的：
var vm = new Vue({
el: '#root',
data: {
message: {
text: "hello"
}
}
})
<script src="https://cdnjs.cloudflar
浏览 7提问于2017-01-02得票数 0
1回答
Vue JS NPM模块导入组件
、、、、
我正在尝试将npm包导入到我的vue.js组件中。具体地说，我正在尝试将ScrollMagic导入到我的项目中，但我将其设置为未定义。 我以前见过有人建议它应该在我的mounted()钩子中，我正在这么做，但我的导入语句(我在main.js和components标记中都尝试过了，但都返回了未定义的变量。任何方向都将不胜感激。 我的组件的脚本： <script>
import { ScrollMagic } from 'scrollmagic';
export default {
name: 'Scroller',
mounted() {
浏览 30提问于2020-12-18得票数 0
回答已采纳
在Vue-cli webpack项目中，我在.env文件中定义了一个环境变量，如下所示：VUE_APP_FONT_SIZE=30px
然后在vue.config.js中，我“添加”如下：
let sav = ''
if (/VUE_APP_/i.test('VUE_APP_FONT_SIZE')) {
sav += `$${'VUE_APP_FONT_SIZE'}: "${process.env['VUE_APP_FONT_SIZE']}";`
}
module.expo
浏览 3提问于2020-09-02得票数 0
回答已采纳
2回答
我和我的团队正在着手进行中、大型应用程序的开发。它是一个Vue 2客户端呈现的应用程序和asp.net核心后端.客户端将用于管理数以万计的项目，他们的status.The应用程序还处于早期阶段，我们一直在考虑如何重新架构我们现有的客户端商店。
由于我们都是新来的，而且自学的，所以我们不确定Vue应用程序中数据管理的最佳模式是什么。
在VueJS应用程序中有推荐的数据管理模式吗？
我们目前的模式如下：
| |
浏览 0提问于2021-04-06得票数 1
回答已采纳
我试着用Vuex从火力基地获取数据。我正在与firebase进行通信，将数据提交到突变中，getter将从状态获取数据。然后，我想在App.vue中显示状态数据。
在App.vue组件中，我用挂载函数编写了分派，并尝试从Vuex获取数据。但是，我得到了错误的"TypeError: this.$store.dispatch is not a function"，当我检查状态时，它说是未定义的。我的行为和突变写得对吗？为什么我会犯这个错误？
store.js
import Vue from 'vue';
import Vuex from 'vuex'
浏览 2提问于2020-06-15得票数 0
回答已采纳
我正在使用Webpack 2，并试图捆绑一个通用库，该库将用于我公司的几个项目中。依赖项包括vue、vue-router和其他一些。将这些供应商依赖项打包到一个公共文件中，然后将其作为外部文件包含在各个项目中似乎是有意义的。然而，我似乎不能让它工作。
我的库webpack.config.js包括行：
entry: {
common: [
'vue',
'vue-router'
]
}
...
output: {
filename: '[name].js',
libraryTarget
浏览 4提问于2017-04-14得票数 0
我在Vue3的项目根目录下有一个.env文件。在components文件夹中，我有Card.vue和以下代码 console.log(process.env.FOO) 但在浏览器中，它显示为未定义。
浏览 33提问于2021-03-19得票数 1
回答已采纳
Vue文件数据没有显示在叶片模板中。控制台中出现的错误是：
未能装入组件:未定义的模板或呈现函数。
我构建了一个vue文件，并试图在刀片中显示vue的数据，但它没有显示“帮助我”。
这是我的主要js文件app.js
require('./bootstrap');
window.Vue = require('vue');
import Vue from 'vue';
Vue.component('chat-form-component', require('./components/ChatFormCompone
浏览 0提问于2019-05-08得票数 1
我和VueJS Laravel有个问题
这是我的Home.vue
<template>
<table>
<tr v-for="models in model.data">
{{models.nom}}
</tr>
</table>
</template>
<script>
import axios from 'axios'
export default{
data() {
return
浏览 1提问于2018-03-17得票数 0
我在main.js文件中定义了全局变量如下
const app = Vue.createApp({})
app.config.globalProperties.$myGlobalVariable = globalVariable***
然后，当我试图访问其他js文件中的变量$myGlobalVariable时，它是未定义的，但我可以访问vue组件。
在vue 2中，可以同时访问js文件和vue组件。希望你能帮我:)
浏览 14提问于2022-06-21得票数 1
我正在尝试在一个刚刚通过Vue CLI > vue create vuetify创建的新Vue项目的基础上安装Vuetify。但是，每次向浏览器提供该项目时，我都会遇到这样的情况：
此外，在启动服务器的终端中，我得到：
...suggesting的Vuetify插件没有安装，这正是我认为vue add vuetify应该做的。
以下是精确的复制步骤：
vue create vuetify"Please选择一个预置“。选择：“默认(Vue 2 babel，eslint)"(Vue CLI做它的事情，在browser @ localhost:8080)vu
浏览 0提问于2021-06-06得票数 1
回答已采纳
1回答
如何在vuex中显示存储的值
、、、、
我把数据存储在Vuex商店。以下是它的外观：
基本上，我想在视图中显示first_name。所以我返回了这样的数据：
data () {
return {
first_name: this.$store.state.user.attributes.first_name,
}
},
Ans很容易地希望在div中显示它：
<div>{{first_name}}</div>
但我正在获取vue.esm.js:1906 TypeError:无法读取未定义(读取'first_name')的属
浏览 8提问于2022-02-11得票数 0
在resources/assets/js/app.js中，我创建了eventHub Vue实例：
require('./bootstrap');
var eventHub = new Vue();
Vue.component('todos-list', require('./components/todos/TodoList.vue'));
Vue.component('todos-add', require('./components/todos/TodoAdd.vue'));
const app
浏览 4提问于2016-11-27得票数 1
回答已采纳
2回答
未定义Vuejs类组件字段
、、、、
class App extends Vue {
message = 'Hello!';
shrek;//属性 property
constructor(){
super();
this.shrek = "This is my swamp!";//代入-assignment
//"This is my swamp!"がコンソールで出力されている Prints as it should
console.log(this.shrek);
this.
浏览 0提问于2020-02-05得票数 0
我试图在vue方法中通过axios的post传递数据，并得到错误：
"signinVue.js:60 Uncaught :无法读取未定义的属性'post‘“
Vue脚本：
new Vue({
el:'#app',
data:{
email:'',
code:'',
},
methods:{
signin:function(){
console.log(this.email + ' ' + this.acc
浏览 0提问于2018-04-22得票数 2
回答已采纳
1回答
我最近从Vue-CLI切换到laravel-mix，SCSS变量的用法在Vue-CLI中工作得很好，但在我切换到laravel-mix之后，现在似乎完全不起作用了。
Vue-CLI只是为我处理了所有的事情，我觉得我必须配置一些东西来让变量在laravel-mix中工作。
这是我尝试过的(也是在Vue-CLI中起作用的)：
// vue component
import variables from "@/styles/variables.scss";
// ...
data() {
return {
variables
}
}
methods:
浏览 1提问于2021-06-25得票数 0
2回答
我遇到了Vuex getter问题，gitters以未定义的形式返回(在Vue Dev控制台中，Chrome Dev控制台中没有记录错误)。
如果mapGetters()被注释掉(如下面的示例代码)，返回的数据将显示在屏幕->上，前提是用户单击具有数据的链接。如果用户在数据应该显示的地方直接进入应用程序，数据将不会显示。
有一个，但没有被接受的答案
Vue控制台日志：
国家：
$_lgdHRS:Object
总计:129
GETTERS：
$_lgdHRS/totHrs:未定义
SomeContainer.vue
<script>
import store from
浏览 2提问于2019-01-30得票数 0
2回答
我已经在html页面的脚本标记中包含了vue 1.0.18 min.js。
specialText线路不起作用。
var tagApp;
window.onload = function () {
/* Vue Js App here */
tagApp = new Vue({
el: '#app',
data: {
title: 'Title',
chars: [{
name: "Jarred",
attack: 15,
health: 70,
s
浏览 11提问于2017-08-22得票数 1
回答已采纳
我想调用子组件的方法。
我认为开发人员在呈现所有子组件之后使用$nextTick函数来处理数据。
但是，在通过v-if指令进行呈现时，我如何调用子组件的方法。
这是一个。
var comp = Vue.component('child', {
data:function(){
return {
}
},
template:`
<div class="child">
I'm a child
</div>
`,
methods:{
callFunction:
浏览 1提问于2019-07-22得票数 2
回答已采纳
我试着用Vue反向显示一个字符串。我的模板是：
<div id="app">
<reverse :msgreverse="message" :reverseMessage="reverseMessage()"></reverse>
</div>
我的剧本是：
function reverseMessage(msg) {
return msg.split('').reverse().join('')
}
Vue.component('reverse&#
浏览 0提问于2018-09-12得票数 6
回答已采纳
2回答
我很难理解为什么在Vue组件中数组是未定义的。以下是流程：
SelectCategories.vue组件使用路由器推送到Quiz.vue组件。在这里，我使用道具将数据传递给Quiz组件。下面是它的实现方式：
else {
this.$router.push({
name: 'quiz',
params: {
items: selectedCategories
}
})
}
我们继续讨论Quiz.vue组件，在这里我将对创建的生命周期挂钩执行
浏览 1提问于2021-01-12得票数 2
回答已采纳
未能挂载组件:模板或呈现函数未定义。
嗨，伙计们，我试图在我的项目Laravel/ Vue中使用类型记录，但是我遇到了一些问题，比如错误消息(未能挂载组件:模板或未定义的呈现函数)。
请大家帮帮忙，谢谢大家
app.js
require('./bootstrap');
window.Vue = require('vue');
import Example from './components/Example.vue';
const app = new Vue({
el: '#app
浏览 5提问于2020-03-01得票数 1
1回答
请帮助我，它总是说不能读取属性‘提交’的未定义。这是我在store.js中的代码。
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);
export const store = new Vuex.Store({
state:{
timer: null,
totaltime: (25 * 60)
},
mutations:{
startTimer: (state, context) => {
//here is the proble
浏览 4提问于2019-12-13得票数 4
回答已采纳
1回答
请帮帮我！我在子模板中有“未定义”道具。
主要js：
// some code before
window.Vue = require('vue');
import EventBus from '../components/event-bus';
// some code after
Vue.component('calendar-select', require('../components/admin/calendar_select.vue'));
const app = new Vue({
el: '#a
浏览 5提问于2017-08-18得票数 8
回答已采纳
我有一个指令需要更新Vue.component中的数据。如何设置值？这是我的代码：
Vue.directive('loggedin', function(value) {
console.log('loggedin = ' + value);
vm.$set('loggedIn', value);
});
$set(‘loggedIn’，value)不起作用。我得到以下错误:未定义的TypeError:无法读取未定义的属性'$set‘
var ck = Vue.component('checkout', {
浏览 10提问于2016-03-03得票数 1
如果您在Vue.js模板中显示一个对象的属性，而该对象是未定义的-这将导致组件崩溃，这是已知的吗？如果常规变量是未定义的，那么它们是没有问题的。
这种行为是一种扫兴。在我的情况下，这看起来很普通，避免这个问题的最好方法是什么？
因此，我将数据存储在NoSQL数据库Mongo中，并使用Vue.js组件来查看和修改集合中的文档。效果很好。
但是，如果我将一个具有属性的对象添加到我的模式中(例如，address with zip，state...)，并更新组件以显示它们，现在我的webapp中显示这些文档的所有组件都将崩溃，因为该对象不在数据中。只有新文档(包含新对象)才能正确显示，除非我遍历数据库
浏览 1提问于2017-10-03得票数 0
1回答
根据的帮助，我创建了以下app.js
/**
* First we will load all of this project's JavaScript dependencies which
* includes Vue and other libraries. It is a great starting point when
* building robust, powerful web applications using Vue and Laravel.
*/
import Vue from 'vue'
import VueRouter from &
浏览 0提问于2018-03-15得票数 0
回答已采纳
"vue": "^2.4.4"
我在main.js中定义了属性：
Object.defineProperties(Vue.prototype, {
baseURL: {
value: process.env.API_ROOT,
writable: false
}
});
我在src/common中有另一个名为version.js的js文件。
import Vue from "vue";
let app = new Vue({
el: "#app",
})
console.log("-------
浏览 3提问于2020-09-09得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
