search

therufa / mdi-vue

Material design icons for vue.js
https://www.npmjs.com/package/mdi-vue
MIT License
88 stars 13 forks source link

Add possibility to use object for property "class" #54

Closed robertfausk closed 3 years ago

robertfausk commented 3 years ago

It would be nice if the following is working:

<mdicon
  v-if="isOpen"
  name="ArrowCollapseVertical"
  :class="{ 'text-blue': isOpen, 'text-red': !isOpen }"
/>

but it is just simply ignored.

Currently i depend on following workaround:


<mdicon
  v-if="isOpen"
  name="ArrowCollapseVertical"
  class="text-blue"
/>
<mdicon
  v-else
  name="ArrowCollapseVertical"
  class="text-red"
/>
therufa commented 3 years ago

Hi @robertfausk, thanks for reporting this issue. Could you please provide a little more detail on which version of vue you've been using?

robertfausk commented 3 years ago

Hi @robertfausk, thanks for reporting this issue. Could you please provide a little more detail on which version of vue you've been using?

Of course :) I am using "mdi-vue": "2.2.0" and "vue": "2.6.12". Same for #52 and #53

therufa commented 3 years ago

@robertfausk i've just released a fix for this with v2.2.3 on npm.

Feedback is highly appreciated. Keep up the good work! :)

ataylor32 commented 3 years ago

I'm getting this warning in v2.2.3, but not v2.2.2:

[Vue warn]: Property "class" was accessed during render but is not defined on instance.
at <MDIcon name="alert" >
at <App>
larescze commented 3 years ago

I'm getting this warning in v2.2.3, but not v2.2.2:

[Vue warn]: Property "class" was accessed during render but is not defined on instance.
at <MDIcon name="alert" >
at <App>

Same problem with vue ^3.0.5.

therufa commented 3 years ago

hey @larescze and @ataylor32, I've updated the lib to a new major version due to a few breaking changes, but the warnings should be gone now. The import path changed though, so you'd need to import the lib as follows: import mdiVue from 'mdi-vue/v2'

larescze commented 3 years ago

hey @larescze and @ataylor32, I've updated the lib to a new major version due to a few breaking changes, but the warnings should be gone now. The import path changed though, so you'd need to import the lib as follows: import mdiVue from 'mdi-vue/v2'

I just checked it out and the warnings no longer appear. Great work!

therufa commented 3 years ago

hey @larescze and @ataylor32, I've updated the lib to a new major version due to a few breaking changes, but the warnings should be gone now. The import path changed though, so you'd need to import the lib as follows: import mdiVue from 'mdi-vue/v2'

I just checked it out and the warnings no longer appear. Great work!

Thanks! :) closing this issue then