Closed FiretronP75 closed 6 years ago
OK so the problem is not that it doesn't work, but that the documentation is wrong. Changing the title.
ReadMe needs to be updated to match what is in this jsfiddle https://jsfiddle.net/q7f0Lmf5/1/ that I found in issue https://github.com/shakee93/vue-toasted/issues/45
The readme is fine, you're just passing a string
instead of an object like it is expecting:
the readme shows the format as:
this.$toasted.global.my_app_error({
message : 'Not Authorized to Access'
});
and yours looks like this:
this.$toasted.global.my_app_error('Not Authorized to Access');
So if you do it that way, you could structure it like so:
Vue.use(Toasted);
Vue.toasted.register('test', payload => {
if ( !Object.keys(payload).length )
return `Nothing Passed: ${ JSON.stringify(payload) }`; // Empty object
if ( !!payload.message )
return `object.message: ${ JSON.stringify(payload) }`; // Custom object
if ( typeof(payload) === 'string' )
return `String Passed: ${ payload }`; // string passed
},
'success');
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
mounted() {
// payload == { message: '...' } so we need to use payload.message when registering
this.$toasted.global.test( {message: 'Pass an Object'} ); // Object Passed to function
this.$toasted.global.test( 'Just a string' ); // payload == 'just a string'
this.$toasted.global.test(); // Default Message
}
});
Fiddle: https://jsfiddle.net/d2hr54j7/
And to have a default message for example:
Vue.toasted.register('test', payload => {
if ( !Object.keys(payload).length )
return `Error Message`; // Empty object
if ( !!payload.message )
return `object.message: ${ payload.message }`; // Custom object
if ( typeof(payload) === 'string' )
return `String Passed: ${ payload }`; // string passed
},
'success');
Ah, it wasn't clear that the "payload" section of the readme was required for the previous section. It reads like 2 separate topics.
I can see that, would it make more sense to show the registration first and then show how you pass the object?
I'll admit that unless you're really familiar with javascript it isn't immediately clear that the object is passed to the function you register. I was a little confused at first as well after looking at your example I can see why it's confusing. I'm not sure what the best way to simplify this is though.
Any suggestions?
Yes guyz, this is the most complicated part in the plugin. i tried my best to explain it. if you guyz can provide a better easier way to update that part of the doc i would be happy to update the doc
I will comment in the new issue.
The readme says you can pass a message to a globally registered toast like this:
this.$toasted.global.my_app_error({ message : 'Not Authorized to Access' });
But it does not work.