renoguyon / vuejs-noty Goto Github PK

i want to Noty support Vue 3, please..

Thanks.

I'm attempting to add confirmation buttons to the dialog per https://ned.im/noty/#/confirm. When I try either ...

this.$noty.button('YES', 'btn', function () { console.debug('foo'); })

or

VueNoty.button('YES', 'btn', function () { console.debug('foo'); })

... and attempt to add it to the message's buttons property, I get the following error:

TypeError: this.$noty.button is not a function

I have vue version 2.6.12 and vuejs-noty version 0.1.3. I initialize:

Vue.use(VueNoty, {
  timeout: 4000,
  progressBar: false,
  layout: 'topCenter',
});

and call it in a component:

      console.log(this.$noty)
      this.$noty.show("Status updated!")

the noty object is printed, but there is absolutely no notification, absolutely nothing happens in the screen. There is no error in the console. How can I proceed to debug it further?

(or am i doing it wrong?)

// ...
mounted() {
      this.$noty.show('Notification', { timeout: 3000 })
},
// ...

[Vue warn]: Error in mounted hook: "TypeError: Cannot create property 'timeout' on string 'alert'"

    at t (vuejs-noty.js?caee:formatted:327)
    at Object.t [as deepExtend] (vuejs-noty.js?caee:formatted:327)
    at new t (vuejs-noty.js?caee:formatted:1293)
    at Object.show (vuejs-noty.js?caee:formatted:1736)
    at VueComponent.mounted (ExchangeTrade.vue?1bec:67)
    at callHook (vue.esm.js?efeb:2921)
    at Object.insert (vue.esm.js?efeb:4158)
    at invokeInsertHook (vue.esm.js?efeb:5960)
    at Vue.patch [as __patch__] (vue.esm.js?efeb:6179)
    at Vue._update (vue.esm.js?efeb:2660)``` 


thanks for any help :)

How to use vuejs-noty in html file?
I try add

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuejs-noty.min.js"></script>
<script>
	Vue.use(VueNoty);
</script>

but have error:
ReferenceError: VueNoty is not defined

// plugins/noty.js
import Vue from 'vue'
import 'vuejs-noty/dist/vuejs-noty.css'
const VueNoty = require('vuejs-noty')

Vue.use(VueNoty, {
  timeout: 3000,
  progressBar: true,
  layout: 'topRight'
})

// nuxt.config.js
// If set ssr to true, it will the throw error 'document is not defined'
plugins: [
    { src: '@/plugins/noty.js', ssr: false },
  ]

<script>
// index.vue
export default {
  mounted () {
    console.log(this.$noty)
  }
}
</script>

$noty is undefined
$noty doesn't seem to be added to the Vue prototype, what should I do?

If I'm using the onTemplate callback, currently I don't seem to be able to include custom components in my markup.

Is there anyway to achieve this?

The link to Noty's documentation in the README is broken.

The original noty has got a callback called 'onCloseClick', which is invoked if the noty is closed by the user clicking it.

Try run example from README.md

this.$noty.create({
    text: 'This is a custom notification!',
    type: 'warning',
    layout: 'topCenter',
    timeout: 4500,
    progressBar: false
}).show();

throw error
TypeError: this.$noty.create is not a function

There should be an XSS handling option. I was really shocked when I was testing and saw that vue-noty doesn't filter out HTML. This is not very hard to solve but there should be an option for it!
thanks

There have been a few updates to this repo and NPM still has an old copy.

Could you version bump the project so NPM can copy over the updates?

I have no acces to the API methods as described in https://ned.im/noty/#/api.

When adding a message, I want to be able to close the message programmatically via the instance created as on line https://github.com/renoguyon/vuejs-noty/blob/master/src/index.js#L26.
Using the close() method.

Perhaps the methods, like success, error, ...etc, should return the instance of the created object.

How can I use the $noty inside Vuex modules?

Currently what I'm doing is this:
pages/index.vue

export default { 
  created() {
    this.$store.dispatch('getUsers, this) // currently I need to pass this in order to use the $noty inside vuex module
  }, 
  computed: {
    users() {
      return this.$store.getters.users;
    }
  }
}
</script>

store/modules/users.js

export const state = () => ({
   users: []
});

export const actions = () => ({
  getUsers({commit}, context) {
      context.$noty.success('HELLO WORLD') `How can I use $noty without passing the this from the component?`
  } 
});

Trying to close all messages using this:

this.$noty.closeAll();

Receiving this error:

Uncaught TypeError: this.$noty.closeAll is not a function

All other methods (this.$noty.success, this.$noty.error etc) are working fine.

Any idea why?? Thank you.