Justineo / vue-awesome

Awesome SVG icon component for Vue.js, built-in with Font Awesome icons.

Home Page:https://justineo.github.io/vue-awesome/demo/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Binding Issue

abdokouta opened this issue · comments

Hello, i'm trying to bind icon name to fetch it from api and i already did as a plain text, so not i'm doing <icon :name="brands/${item.title}"></icon> and i'm getting "Cannot read property 'paths' of null" so it causes by the binded name. i don't know what's wrong with this code .. any advices?

Did you import the corresponding icons?

Did you import the corresponding icons?

i did made a vue plugin called vue-icon.js and here is what contains

`import Vue from 'vue'
import Icon from 'vue-awesome/components/Icon.vue'
require('vue-awesome/icons')

Vue.component('icon', Icon)
`

And what does your item.title resolve to? I need some real reproduction to look into.

i'm getting menu items via WP Reset Api and i have store it in veux and return it back to my component here the component code

<li class="list-inline-item" v-for="item in $store.state.socialmenu" :key="`${item.ID}`">
  <app-link target="_blank" v-html="item.title" :to="`${item.url}`">
    <icon :name="`brands/${item.title}`"></icon>
  </app-link>
</li>

This is not a valid reproduction. Would you mind provide the minimal runnable code for this issue?

This is not a valid reproduction. Would you mind provide the minimal runnable code for this issue?

`in ./components/SocialMediaIcons.vue?vue&type=template&id=8dbb8684& (./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/SocialMediaIcons.vue?vue&type=template&id=8dbb8684&)
Module Error (from ./node_modules/vue-loader/lib/loaders/templateLoader.js):
(Emitted value instead of an instance of Error)
Error compiling template:

  • invalid expression: Unterminated template literal in

    brands/${item.title

Raw expression: :name="brands/${item.title" `

the problem is in that line <icon :name="brands/${item.title}"></icon> i don't know what is wrong with also this line of error shows

Cannot read property 'paths' of undefined

Raw expression: :name="brands/${item.title" `

I'm sorry but I don't think it's the problem...

Without knowing what item.title is I have no way to offer help...

Raw expression: :name="brands/${item.title" `

I'm sorry but I don't think it's the problem...

Without knowing what is item.title I have no way to offer help...

it was my problem the code if fine but i was written the letter in capitalize that was making the bug