script标签引入vue方式开发如何写组件
title: script标签引入vue方式开发如何写组件date: 2020-05-08sidebarDepth: 2tags:
vue组件script标签categories:vue
很多人知道.vue结构的单文件组件形式,不过这种单文件组件的结构如果要加入到现有的jquery项目中就比较麻烦了,那如果我们又想用vue来写模板,又不想引入vue-cli管理,那该怎么来写组件呢?
1.首先在正常使用cdn引入jquery的项目中,也用script标签引入Vue.js文件。2.为了方便测试我们在页面中写个按钮,这个按钮的作用就是要展示jquery和vue同时正确使用并不互相冲突。3.下面进入正题,我们来定义我们的vue组件。4.父页面调用这个组件,最外层必须是vue的实例id为app的div元素包裹才行。5.另一则案例
很多人知道.vue结构的单文件组件形式,不过这种单文件组件的结构如果要加入到现有的jquery项目中就比较麻烦了,那如果我们又想用vue来写模板,又不想引入vue-cli管理,那该怎么来写组件呢?别着急往下看!
1.首先在正常使用cdn引入jquery的项目中,也用script标签引入Vue.js文件。<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.js"></script>
2.为了方便测试我们在页面中写个按钮,这个按钮的作用就是要展示jquery和vue同时正确使用并不互相冲突。<input id="btn" type="button" value="jquery操作">
3.下面进入正题,我们来定义我们的vue组件。Vue.component("card"
如何,引入,方式,标签,开发