最近在维护公司的项目，当我拿到项目时，发现他用了vue。

但是~~仅仅是引用vue.js文件，整体的架构还是html那种，没有用webpack！

当时觉得~哇~原来还可以这样！

然后了解了业务逻辑和代码逻辑，觉得这个人写的~emmm~~~，没办法只能按照之前的思路去写~

开发新页面时，我就引用了vue的组件(上个人仅仅是用到了双向绑定这个好处)，

下面附上在html中引用vue组件的写法：

第一步：首先引用 httpVueLoader.js, 再引用Vue.use(httpVueLoader)---这步很重要

第二步：创建vue组件，引用vue组件

第三步：在html中写引用组件，就ok啦

ps：在引用组件时，中途出现了小插曲。从第二步可以看出我的组件名起的是AddInfo.

　　 我一开始在html中引入时直接写成<AddInfo></AddInfo>，怎么都显示不了组件！后来才知道，vue2.0组件命名区分大小写了，哈哈哈哈~

　　在这里就不细说了，有时间会专门写一篇关于命名规则的~

新手上道，写的不足的地方请大家提出来哦~~

在html中使用vue组件的更多相关文章

  1. Laravel 如何在blade文件中使用Vue组件

    Laravel 如何在blade文件中使用Vue组件 1. 安装laravel/ui依赖包 composer require laravel/ui 2.生成vue基本脚手架 php artisan u ...

  2. 在webpack中配置.vue组件页面的解析

    1. 运行`cnpm i vue -S`将vue安装为运行依赖: 2. 运行`cnpm i vue-loader vue-template-compiler -D`将解析转换vue的包安装为开发依赖: ...

  3. Laravel 项目中编写第一个 Vue 组件

    和 CSS 框架一样,Laravel 不强制你使用什么 JavaScript 客户端框架,但是开箱对 Vue.js 提供了良好的支持,如果你更熟悉 React 的话,也可以将默认的脚手架代码替换成 R ...

  4. vue组件中使用iframe元素

    需要在本页面中展示vue组件中的超链接,地址栏不改变的方法: <template> <div class="accept-container"> <d ...

  5. Vue (三) --- Vue 组件开发

    ------------------------------------------------------------------好心情,会让你峰回路转. 5. 组件化开发 5.1 组件[compo ...

  6. vue 组件开发、vue自动化工具、axios使用与router的使用(3)

    一. 组件化开发 1.1 组件[component] 在网页中实现一个功能,需要使用html定义功能的内容结构,使用css声明功能的外观样式,还要使用js定义功能的特效,因此就产生了一个功能先关的代码 ...

  7. 三: vue组件开发及自动化工具vue-cli

    一: 组件化开发 1 组件 1: 组件(Component)是自定义封装的功能.在前端开发过程中,经常出现多个网页的功能是重复的,而且很多不同的网站之间,也存在同样的功能. 2: 什么是组件 而在网页 ...

  8. 基于vue组件，发布npm包

    亲测好用,如出错,请留言 1.项目初始化 使用vue脚手架创建,但vuecli太重,我们使用简单的工程脚手架进行处理,输入命令 vue init webpack-simple my-project n ...

  9. Vue组件介绍及开发

    一. 通过axios实现数据请求 1.json json是 JavaScript Object Notation 的首字母缩写,单词的意思是javascript对象表示法,这里说的json指的是类似于 ...

随机推荐

  1. Powershell如何制定属性并输出

    这个标题看着有些云里雾里.... 前一阵,群里有个朋友问博主“我想把所有用户的SMTP地址全部输出到CSV文件中进行统计,但是SMTP地址似乎输出的是错误的,可在shell里看输出的内容是正确的阿” ...

  2. Linux c++ vim环境搭建系列（1）——Ubuntu18.04.4编译安装vim8.2

    1. vim源码编译安装 参考网址: https://github.com/ycm-core/YouCompleteMe/wiki/Building-Vim-from-source 安装各类依赖库 s ...

  3. CVE-2019-0232 远程代码执行漏洞-复现

    0x00 漏洞介绍 该漏洞是由于Tomcat CGI将命令行参数传递给Windows程序的方式存在错误,使得CGIServlet被命令注入影响. 该漏洞只影响Windows平台,要求启用了CGISer ...

  4. 【Java】【常用类】 Arrays工具类 源码学习

    虽然在数组的随笔中有说过,但实际上应该仔细深入一下源码进行分析 源码没有想象中的高大上,代码终究还是写给人看的,可读性大于执行性 最小阵列排序:1 乘 2的13次方 =  8192 学识浅薄,暂时还不 ...

  5. animation-play-state 在 ios 中不生效的解决办法（JS篇）

    我们要实现动画的播放和暂停,animation-play-state 在安卓端可以使用,但是在 ios 中不起作用,这时可以使用 js 来实现相同效果. 原理 通过 js 获取当前元素的 transf ...

  6. scheduler_default_filters 详解

    Filter scheduler 是 nova-scheduler 默认的调度器,调度过程分为两步:     通过过滤器(filter)选择满足条件的计算节点(运行 nova-compute) 通过权 ...

  7. iview使用之怎样通过render函数在table组件表头添加图标及判断多个状态

    在实际项目开发中,我们经常会用到各种各样的表格,比如在表格中填加下拉菜单,按钮,图标及可以根据状态显示对应文字等等,因为这段时间一直在做后台管理系统,所以表格用的就比较多,当然UI组件库我用的是ivi ...

  8. 域名和服务器绑定及https协议更换

    服务器是之前已经购买了的 1.腾讯云产品中搜索域名注册(产品太多了懒得找,直接搜索来得快些) 2.进去之后可以选择各种后缀的域名,输入自己喜欢的,看看哪些后缀是没有被注册的.自己挑选一个就可以,按照指 ...

  9. 测试Thread中的常用方法

    package com.yhqtv.java; /* *测试Thread中的常用方法: * 1.start():启动当前线程:调用当前线程的run() * 2.run():通常需要重写Thread类的 ...

  10. WebApi参数检查验证FluentValidation的使用方法

    右键打开NuGet程序包管理,进入浏览,搜索 FluentValidation,点击下载 在Model文件夹添加一个Person类进行校验 校验前,using需要引入相应的命名空间方可使用,Abstr ...