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


Posted in Javascript onApril 13, 2017

1.vuejs组件之间的调用components

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

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

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

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

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

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

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

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

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

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

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

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

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

解决办法:

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

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

解决方案:

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

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

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)
 })
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery编写的横向自适应幻灯片切换特效的实例代码
Aug 06 Javascript
jQuery Trim去除字符串首尾空字符的实现方法说明
Feb 11 Javascript
JS学习之表格的排序简单实例
May 16 Javascript
详解利用exif.js解决ios手机上传竖拍照片旋转90度问题
Nov 04 Javascript
使用Node.js搭建静态资源服务详细教程
Aug 02 Javascript
使用JavaScript实现点击循环切换图片效果
Sep 03 Javascript
vue router仿天猫底部导航栏功能
Oct 18 Javascript
vue-cli2.x项目优化之引入本地静态库文件的方法
Jun 19 Javascript
详解vue的双向绑定原理及实现
May 05 Javascript
jQuery中DOM常见操作实例小结
Aug 01 jQuery
vue2.0 解决抽取公用js的问题
Jul 31 Javascript
如何在vue-cli中使用css-loader实现css module
Jan 07 Vue.js
JavaScript数据结构之二叉树的遍历算法示例
Apr 13 #Javascript
为Jquery EasyUI 组件加上清除功能的方法(详解)
Apr 13 #jQuery
vue组件如何被其他项目引用
Apr 13 #Javascript
微信小程序开发之数据存储 参数传递 数据缓存
Apr 13 #Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 #jQuery
老生常谈javascript中逻辑运算符&amp;&amp;和||的返回值问题
Apr 13 #Javascript
JS实现移动端实时监听输入框变化的实例代码
Apr 12 #Javascript
You might like
PHP中防止SQL注入实现代码
2011/02/19 PHP
php面向对象 字段的声明与使用
2012/06/14 PHP
php实现信用卡校验位算法THE LUHN MOD-10示例
2014/05/07 PHP
php把数据表导出为Excel表的最简单、最快的方法(不用插件)
2014/05/10 PHP
php curl常用的5个经典例子
2017/01/20 PHP
使用Codeigniter重写insert的方法(推荐)
2017/03/23 PHP
php图像验证码生成代码
2017/06/08 PHP
用于节点操作的API,颠覆原生操作HTML DOM节点的API
2010/12/11 Javascript
跨浏览器的事件对象介绍
2012/06/27 Javascript
js购物车实现思路及代码(个人感觉不错)
2013/12/23 Javascript
JavaScript中的异常捕捉介绍
2014/12/31 Javascript
javascript实现的固定位置悬浮窗口实例
2015/04/30 Javascript
js实现的二级横向菜单条实例
2015/08/22 Javascript
javascript类型系统 Window对象学习笔记
2016/01/07 Javascript
js HTML5手机刮刮乐代码
2020/09/29 Javascript
微信小程序 icon组件详细及实例代码
2016/10/25 Javascript
jQuery实现可移动选项的左右下拉列表示例
2016/12/26 Javascript
jQuery.Form实现Ajax上传文件同时设置headers的方法
2017/06/26 jQuery
其实你可以少写点if else与switch(推荐)
2019/01/10 Javascript
Vue触发隐藏input file的方法实例详解
2019/08/14 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
vue实现商品列表的添加删除实例讲解
2020/05/14 Javascript
ES2020系列之空值合并运算符 '??'
2020/07/22 Javascript
Python导入txt数据到mysql的方法
2015/04/08 Python
python实现在pandas.DataFrame添加一行
2018/04/04 Python
python中reader的next用法
2018/07/24 Python
Python3从零开始搭建一个语音对话机器人的实现
2019/08/23 Python
基于Python实现扑克牌面试题
2019/12/11 Python
Pytorch实现基于CharRNN的文本分类与生成示例
2020/01/08 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
详解python程序中的多任务
2020/09/16 Python
CSS3 实现的缩略图悬停效果
2020/12/09 HTML / CSS
中国网上药店领导者:1药网
2017/02/16 全球购物
个人自我鉴定写法
2013/11/30 职场文书
专业见习报告范文
2014/11/03 职场文书
python神经网络Xception模型
2022/05/06 Python