在编写vue的时候,页面数据少的时候,可以将所有的js和css都可以直接写在页面上,但是页面数据多,js、css的方法和样式多的时候,都放在一个页面的时候,就显得页面vue十分的臃肿。

所以写项目的时候,还是将其分离会比较合适,这样别的页面也可以引用该方法和样式。

直接上代码:

页面引用js(TestJs.js)和css(Test.css)

<script>
import test from '../pageJs/TestJs'; export default { ... test
}
</script>
<style scoped>
@import "../css/Test.css";
</style>

 js部分

export default {
data() {
return {
test1: 'haha',
test2: '腻害',
test3: '你好啊,我只是测试一下'
}
} }

Vue2之页面 、js 、css分离的更多相关文章

  1. 使Eclipse下支持编写HTML/JS/CSS/JSP页面的自动提示。

    我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用eclip ...

  2. 配置Eclipse编写HTML/JS/CSS/JSP页面的自动提示。

    我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用eclip ...

  3. 在jsp页面下, 让eclipse完全支持HTML/JS/CSS智能提示(转)

      我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用ecl ...

  4. 用html +js+css 实现页面轮播图效果

    html 页面 <html lang="en"> <head> <meta charset="UTF-8"> <met ...

  5. 使用监听器解决路径问题,例如在jsp页面引入js,css的web应用路径

    使用监听器解决路径问题,例如在jsp页面引入js,css的web应用路径 经常地,我们要在jsp等页面引入像js,css这样的文件,但是在服务器来访问的时候,这时间就有关到相对路径与绝对路径了.像网页 ...

  6. 配置Eclipse编写HTML/JS/CSS/JSP页面的自动提示

    我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用eclip ...

  7. 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法   一.CSS和 ...

  8. Eclipse配置编写HTML/JS/CSS/JSP页面的自动提示

    我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用eclip ...

  9. 在jsp页面下, 让eclipse完全支持HTML/JS/CSS智能提示

    我们平时用eclipse开发jsp页面时智能提示效果不太理想,今天用了两个小时发现了eclipse也可以像Visual Studio 2008那样完全智能提示HTML/JS/CSS代码,使用eclip ...

  10. js+css页面横屏

    <!DOCTYPE html> <html lang='zh'> <head> <meta charset="utf-8" /> & ...

随机推荐

  1. 【Shell】通配符与特殊符号

    ——来自<鸟哥的Linux私房菜> 在 bash 的操作环境中还有一个非常有用的功能,那就是通配符 (wildcard) ! 我们利用 bash 处理数据就更方便了!底下列出一些常用的通配 ...

  2. 高性能MySQL之【第十六章MySQL用户工具】学习记录

    接口工具:      Msql Workbench   http://www.mysql.com/products/workbench      SQLyog  http://www.webyog.c ...

  3. AtCoder Beginner Contest 104

    A - Rated for Me Time Limit: 2 sec / Memory Limit: 1024 MB Score : 100100 points Problem Statement A ...

  4. 闪回之 Flashback Data Archive

    背景:Oracle 11g 中 Flashback Data Archive 特性.将变化数据另外存储到创建的闪回归档区(Flashback Archive)中,以和 undo 区别开来,这样就可以为 ...

  5. kkkk

    monkey -p com.alfl.www  -v -v -v  --throttle 50 --pct-touch 30 --pct-motion 15 --pct-nav 15 --pct-ma ...

  6. grep的用法(CentOS7)及有关正则表达式的使用

    环境准备:alias grep="grep --color" 1.grep以整行为单位进行处理,行中有的匹配显示出来 Last中取出符合root的行:grep  '查找字符串' l ...

  7. ICU 是一种说不出的痛啊

    USE [Nursing] GO /****** Object: StoredProcedure [dbo].[P_GetICUVitualSign] Script Date: 05/21/2015 ...

  8. MATLAB 内存容量修改 zz

    MATLAB 内存容量修改 - Oliver的日志 - 网易博客 在用MATLAB做图像处理时 经常会碰到内存溢出的情况,可用如下方法修改,使得MATLAB的内存容量最大: 出自matlab:matl ...

  9. 慕课网java就业班级

    家里电脑教程路径: F:\教程\java-慕课 开发工具路径: D:\java 公司电脑:开发工具路径 J:\java\开发工具 教程路径: G:\学习中\廖雪峰的java教程\1-Java快速入门\ ...

  10. 实训随笔4:HTML初入门

    1.<td>与<tr>标签 表格制作时,应该一行一行的画,即<tr>应该包含<td>标签,正确示例如下: <h3>测试数组初始化与操作< ...