Skip to content

Property or method "toJSON" is not defined #333

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
duziaqin opened this issue May 21, 2017 · 11 comments
Closed

Property or method "toJSON" is not defined #333

duziaqin opened this issue May 21, 2017 · 11 comments

Comments

@duziaqin
Copy link

TL;DR:
when we use Vue.use to add a plugin, which render a component instance(with Vue.extend), and the component $emit events with vue instance as payload. It cause vue warns.
image

version:
vue(>2.0.0) vue-devtool(latest)
demo:
codepen
(can't reproduce the bug unless u copy the code, start a demo and open vue-devtool)
bug:
vue warns: Property or method "toJSON" is not defined
facts:

  • JSON.stringify would try to call toJSON attr when it meets object. spec
  • vue-devtool use JSON.stringify (or circular-json-es6) to deep copy(I guess) the $emit payload
  • vue use Proxy(_renderProxy) to warn not defined attr or method during render in develop mode

screen shot 2017-05-21 at 15 31 53

  • vue call the _init function (which included _renderProxy) in Vue and Vue.extend(produce _Ctor)

reason

  • vue-devtool find out a $emit, try to use JSON.stringify, JSON.stringify meet _Ctor attr first than circular reference
  • _Ctor[0] has _renderProxy, JSON.stringify try to call toJSON, cause getHandler to warn.
  • it's a rare bug, because it happens only when _renderPorxy is reached before circular reference.

but, it's real confusing...

@posva
Copy link
Member

posva commented Jun 11, 2017

Hey, sorry for the delay, I tried your demo on an empty index.html page and no errors appears. I guess it has been fixed recently. If not, add a new repro and I'll take a look 🙂

@posva posva closed this as completed Jun 11, 2017
@duziaqin
Copy link
Author

please try this demo: to-json-error

@posva
Copy link
Member

posva commented Jun 12, 2017

Maybe you need to update your Vue version. Tell me if you manage to boil it down it in a codepen where I can look at the source code

@d1manson
Copy link

d1manson commented Aug 7, 2017

I'm having this issue too. See component linked to above.

@Elevista
Copy link

Elevista commented Sep 1, 2017

@posva @d1manson
I have this issue too.
Same dependency with package-lock.json and same dev tools version
but only mac chrome display this error. windows chrome shows nothing

@KaelWD
Copy link

KaelWD commented Sep 4, 2017

Same here when I have an array of VueComponents in my data object.

Chrome 60 on windows 10.

Here's the relevant part of the stack trace:

Method File Line
warn vue.runtime.esm.js?ff9b 475
warnNonPresent vue.runtime.esm.js?ff9b 1607
get vue.runtime.esm.js?ff9b 1648
stringify backend.js 448
stringify backend.js 1968
flush backend.js: 1465
(anonymous) backend.js 1342
emit VM3281 52

@ElliotPsyIT
Copy link

Any further insights on this 'toJSON' not defined on the instance warning? Like @Elevista, I'm not seeing this on Windows Chrome (nor IE11) but I am seeing it on Mac Chrome. I'm using Vue '2.5.13' and see the error either with or without the Vue dev tools installed.

@davidmoshal
Copy link

+1 for Mac Chrome

1 similar comment
@intermundos
Copy link

+1 for Mac Chrome

@intermundos
Copy link

Found out that chrome extension Kuker was the reason for this warning.

@erwer8363
Copy link

thanks intermundos , it is really because of Kuker, i unstall it , now it is ok...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants