Comments (13)
This bit me in the ass. Wasted 30 minutes thinking my code was wrong.
from devtools.
Most probably the data is actually reactive, but its reactivity it's not being used to do anything on the DOM. In this situation, clicking on the data property in question in Vue devtools would actually "wake it up" and show it's actual value. From what I can see in the template, while you using the prop, you are not referring to data anywhere on the template, thus devtools, in live mode, happily ignores it. Clicking on it should give you its current value.
from devtools.
- Ready detected Vue 1.04
- Console only has one [Vue warn] and a bunch of 404 but no real show stopper
here is what I have:
Vue.component('actorcomp', {
props: ['actor','subjectindex'],
data: function() {
return {actorData: {}};
},
created: function() {
this.loadActorData(this.subjectindex);
},
methods: {
loadActorData: function(index) {
//loading data here
}
},
actorDataLoaded: function(result) {
this.actorData = JSON.parse(result);
}
},
watch: {
subjectindex: function(newVal, oldVal) {
this.loadActorData(newVal);
}
},
template: '<div class="group"><h3>{{actor.label}}</h3><div class="icon icon-{{actor.key}}"></div></div>'
});
boths props are properly refreshed but not the data.
How can I make sure that the data is reactive ?
my appologies for the newb questions I'm not 100% familiar with vue.js yet
from devtools.
For me nothing works except refreshing the tools
from devtools.
It took me 3 hours...
Bug is still there
After learning why it didn't update, I didn't consider it a bug, but it's still not what I expected to happen.
from devtools.
Hmm, I'll need a bit more information as this is supposed to work. Make sure that:
- You've updated to the latest version of vue-devtools (1.0.4)
- There's no error in the console
If both 1 and 2 are true, then it's most likely the data itself is not properly reactive...
from devtools.
related #393
from devtools.
This bit me in the ass. Wasted 30 minutes thinking my code was wrong.
+1
from devtools.
It took me 3 hours...
Bug is still there
from devtools.
If possible to implement, this might make a nice feature request.
from devtools.
Yeah. When building components, I usually build the API and data structure first, before putting any elements together. It's really annoying when this bug happens because you often spend ages trying to work out why the data isn't updating (when viewing via dev tools). As a last resort, you throw the value into the DOM and voila. Extremely frustrating.
from devtools.
This happened to me just now too. It's fixed when I properly add unique key to every component loop
from devtools.
now fix ?
who can tell me ?
thankyou !
from devtools.
Related Issues (20)
- Vue Devtools' detector-exec.js in combination with Cookiebot prevents DOMContentLoaded event? HOT 1
- Performance tab: Wrong timing shown on group
- Devtools Gets "Stuck", Doesn't Refresh on Browser Refresh HOT 12
- Unable to view event details in timeline
- Some component does not show the props panel. HOT 2
- Component State Not Updating HOT 3
- Cannot view AForm(from ant-design-vue) components details, showed me 'Select A Component' HOT 1
- If the base option is configured for Vite, open in editor will fail
- no funciona HOT 2
- README: Mention and link to devtools-next
- Multiple Vue apps mounted cause empty devtools on Chrome HOT 3
- Quickly open the closest parent component that can be opened in the editor.
- It is suspected that vue-devtools causes chrome memory overflow and then crashes HOT 11
- Vue3 chrome devtool not working when vite-plugin-vue-devtools node module is enabled HOT 2
- [PSA] Devtools Next for Vue 3 + Vite users HOT 1
- Pages: mishandling of navigation routes with regex pattern matching HOT 1
- Hotkeys for Vue DevTools HOT 1
- Add way to inspect the dependency chain of a piece of reactive state
- Vue Detected No Components Shown HOT 1
- Infinite loop bug. When the developer tools are closed, an infinite loop bug may occur. HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from devtools.