当前位置: 首页 > 编程笔记 >

vue如何引用其他组件(css和js)

锺离浩慨
2023-03-14
本文向大家介绍vue如何引用其他组件(css和js),包括了vue如何引用其他组件(css和js)的使用技巧和注意事项,需要的朋友参考一下

1.vuejs组件之间的调用components

注意:报错Do not use built-in or reserved HTML elements as component id:

修改组件的名字,例如不能使用address为组件名字

组件名字不要使用内置的或保留HTML元素为组件id,

App.vue是一个入口,vue必须注册才能使用

2.vue引入外部的css,放在和引入vue的位置一样

./代表当前项目,../代表上一级项目

import '../static/style/reset.css' 

如果引用的css,js不起作用,在index.html里面引用,还是不起作用,注意引用顺序

3.关于购物车,Cannot read property 'get' of undefined(…)

解决办法:

在app.vue里面引入js不起作用,引用node_modules里面的也不起作用,在index.html里面引入文件,这个文件是放在style里面的,记得url里面的路径

解决方案:

1.在index里面引入axios.js,vue里面用axios;如果vue里面用vue-resource的$http会报错get“”

axios({
  method: 'get',
  url: '/static/style/cart.json',
  data: {

  }
 })

第二种:使用vue-source,引入外部的js

注意引入顺序

 <script type="text/javascript" src="static/style/vue.min.js"></script>
 <script type="text/javascript" src="static/style/vue-resource.min.js"></script>
 <script type="text/javascript" src="static/style/cart.js"></script>

这是cart.js里面的内容

cartView:function(){
 var _this=this //记得写在get上面,不然取不到值
 this.$http.get('/static/style/cart.json',{'id':123}).then(function(res){
 this.pro=res.body.name;
 //_this.produceList=res.body.result.list;
 console.log(res.body.name)
 })
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍vue组件如何被其他项目引用,包括了vue组件如何被其他项目引用的使用技巧和注意事项,需要的朋友参考一下 自己写的vue组件怎么才能让其他人引用呢,或者是共用组件如何让其他项目引用。本文就粗细的介绍下,如有疑问欢迎共同讨论。在这里你能了解下如下知识点: 1. 如何发布一个包到npmjs仓库上 2.如何引用一个npm包,尤其是本地引用 3.vue组件的两种引用方案 一、发布一个包到np

  • 我正在尝试使用composition API创建Vue 3组件库: https://github.com/hyperbotauthor/vue3complib 在其中一个组件中,我想导入另一个组合API组件(https://github.com/hyperbotauthor/vue3complib/blob/main/src/components/ChessboardExt.vue): 这几乎是可

  • 需求: vue工程A中打开弹窗,内容为独立的验证码。 目的: 这个验证码业务不随工程A迭代升级,而是独立存在的。 1或 单独部署在某个云服务器上; 2或 与A工程一起部署,但与A工程完全0耦合。 问题: 能否将验证码业务独立成插件,在vue项目中import进来? 打包的时候,单独存在于dist中某个独立文件夹? 如何操作,请高手指点,十分感谢~!

  • 我有一个问题,试图测试与样式组件制成的组件。 因此,我有两个组件,如果我将鼠标悬停在第一个元素上,我试图改变第二个组件的背景色。 我的组件: 每当我尝试用jest它总是抛出一个错误,表示。但是,当我在标签中注释对容器组件的引用时,测试通过了。有人能帮忙吗?非常感谢你。 我正在使用react测试库在测试文件中呈现组件。

  • 为了帮助组件更通用和可重用,值得尝试将它们分成容器组件和演示组件。 redux docs. 记住这一点,让我们重构我们的 是一个演示组件。 首先,让我们修改我们的app-container,在它上面有两个计数器组件,就像我们现在有的一样。 View Example 看看这个例子,你可以看到已经有一个 app/reducers/curse-reducer.ts 和 app/actions-curse

  • 我正在学习JSwing,我发现了GridBagLayout。 我试图创建一个简单的计算器,我添加了多个JPanel设置每个首选大小,但当我调整窗框大小时,面板也不会调整大小。然后我发现了Gridbag的布局。 但我得到的是:GridBagLayout的计算器错误 } 应该是这样的:正确的计算器 我试过: 要锚定。。。但它不起作用, 创建多个JPanel(一个带有GridLayout),但不起作用