vuetify和@nuxt/vuetify icon 之我见

2020-03-14 23:39:59

封装有封装的好处,也有封装的烦恼,哎。@nuxt/vuetify替我们省了不少使用vuetify的心,但是这家伙却让我们多了研究他的心,因为他改变了很多vuetify的设置方式,研究它的同时还得研究vuetify。

对于v-icon的研究,总的两点。


v-icon 虽然支持svg的icon,但是它并不直接支持svg的文件。


vuetify中v-icon,貌似默认支持  Material Design Icons, Material Icons, Font Awesome 4 and Font Awesome 5, 我自己单独引入了vuetify 用哪一个图标都没有问题。但是用了@nuxt/vuetify只能用mdi-home这样的。不知道因为啥。肯定是封装后,封装成一个了。

但是我修改vuetify的设置,哪一个图标也都能用。哎,不过多研究了。


总之,他们设置icon的配置,不一样,@nuxt/vuetify需要在nuxt.confing.js中设置。


还有一句话,需要大家理解一下。也是我看源码了解的。


Vuetify comes bootstrapped with support for Material Design Icons, Material Icons, Font Awesome 4 and Font Awesome 5. By default, applications will default to use Material Design Icons.




这句话的最后一句话的意思是,这些图标都能用,是优先使用Material Design Icons.,没找到的话,就去用Font Awesome,代码里面是if else


(isMaterialIcon) {
  .(icon)
} {
  iconType = icon.(delimiterIndex)
  ((iconType)) iconType = }


VIcon.ts


  • 2019-10-27 11:02:10

    mac不要输入sudo,免密设置

    mac有时候使用终端进行操作,会让输入sudo 并且要输入命令,这要很啰嗦,浪费时间,我们得想办法去掉。

  • 2019-10-27 11:08:11

    Mac系统移到废纸篓的快捷键是什么

    用Windows键盘上的delete键和del键都不能删除文件,那么在Mac系统移到废纸篓的快捷键是什么?答:在移到废纸篓的快捷键组合就是Command + delete,可以将文件删除到废纸篓。清空废纸篓的快捷键是 Command + shift + delete​。

  • 2019-10-29 11:30:12

    Vue路由的$router.back(-1)回退时如何判断有没有上一个路由

    这个函数是这样的,判断当前页面的历史记录是不是小于等于1,如果小于等于1,说明这个页面没有可以返回的上一页,如果没有可以返回的上一页,就给地址栏加上一个goindex=true的参数,这样你从这个页面在往下一个页面跳转在返回,这个参数就一直加上的