本文目标:就是把扩散名为.json文件中数据,传递给NewsList.vue文件。主要通过导出,并传递给data(){}变紧

  1. 新建文件名为:commTest.json

    {
    "schoolName": "宿城区府苑实验小学",
    "scores": [{
    "scoreName": "语文",
    "scoreTime": "周二"
    },
    {
    "scoreName": "数学",
    "scoreTime": "周四"
    },
    {
    "scoreName": "英语",
    "scoreTime": "周五"
    }
    ]
    }
  2. 在 NewsList.vue文件中引入代码如下
    <template>
    <div class="NewsList">
    NewsList
    <h1>{{msg}}</h1>
    <h2>{{schoolName}}</h2>
    <ul>
    <li v-for="score in scores"
    :key="score.scoreName">
    {{score.scoreName}}-->{{score.scoreTime}}
    </li>
    </ul>
    </div>
    </template>
    <script>
    // json
    import commTest from '../../assets/commTest.json'
    export default {
    data () {
    return {
    msg: 'NewsList.vue 组件',
    schoolName: '宿城区府苑实验小学',
    //commTest.json文件中scores传给数据变量scores
    scores: commTest.scores
    }
    }
    }
    </script>

comTest.json文件中内容,被NewsList.vue文件引入的更多相关文章

  1. 通过java 来实现对多个文件的内容合并到一个文件中

    现在有多个txt文本文件,需要把这么多个文件的内容都放到一个文件中去 以下是实现代码 package com.SBgong.test; import java.io.*; public class F ...

  2. 读取xlsx文件的内容输入到xls文件中

    package com.cn.peitest.excel; import java.io.File; import java.io.FileInputStream; import java.io.Fi ...

  3. 文件下载Controller,文件夹内容监听,文件上传,运行程序通过url实现文件下载

    文件下载Controller @RequestMapping("/fileDownLoad") public ResponseEntity<byte[]> fileDo ...

  4. JavaScript进阶(二)在一个JS文件中引用另一个JS文件

    在一个JS文件中引用另一个JS文件       转载地址:http://blog.csdn.net/zndxlxm/article/details/7875787 方法一 在调用文件的顶部加入下例代码 ...

  5. 在一个另一个文件中 #include一个**dlg.h文件,会发生dlg的资源ID未定义的错误 :

    1    在一个另一个文件中 #include一个**dlg.h文件,会发生dlg的资源ID未定义的错误 : dlg1.h(23) : error C2065: 'IDD_DIALOG1' : und ...

  6. vue.js使用webpack发布,部署到服务器上之后在浏览器中可以查看到vue文件源码

    webpack+vue 2.0打包发布之后,将发布的文件部署到服务器中之后,浏览器中访问的时候会出现一个webpack文件夹,里边会显示vue文件源码 如果不想让vue源文件显示出来,可以在confi ...

  7. 如何在一个文件中写多个Vue组件(译-有删改)

    原文地址 Writing multiple Vue components in a single file 在一个文件中编写多个组件是React的模式,其中一些文件包含多个组件. 走开发过程中,有些组 ...

  8. 快速搜索多个word、excel等文件中内容

    背景:要在多个文件甚至文件夹中找到文件中包含的某些内容 以win10举例: 1.打开一个文件夹 2.打开文件夹选项 3.配置搜索 4.搜索文件

  9. linux下复制一个文件的内容到另一个文件

    cat path/to/file/filename1 >> path/to/file/filename2 例如: cat id_rsa.pub >> ~/.ssh/author ...

随机推荐

  1. 死磕mysql

    数据库创建语句 create database new; 创建一个名为new 的数据库 drop database new; 删除名为new的数据库 数据库名为小写,当初教我的那个人对我说在某个系统中 ...

  2. 手把手实操教程!使用k3s运行轻量级VM

    前 言 k3s作为轻量级的Kubernetes发行版,运行容器是基本功能.VM的管理原本是IaaS平台的基本能力,随着Kubernetes的不断发展,VM也可以纳入其管理体系.结合Container和 ...

  3. qt5连接sqlite数据库实例

    建库 在VS下新建qt console appication 代码: #include <iostream> #include <Qtsql/QSqlDatabase> #in ...

  4. LeetCode.509——斐波那契数

    问题描述: 斐波那契数,通常用 F(n) 表示,形成的序列称为斐波那契数列.该数列由 0 和 1 开始,后面的每一项数字都是前面两项数字的和.也就是: F(0) = 0, F(1) = 1 F(N) ...

  5. Java入门基础(变量、操作符与表达式)

    Java入门基础 1. 第一个程序 2.变量(命名.运算.整数/小数/字符串.布尔类型) 3.操作符与表达式(算术/逻辑/关系/赋值/自增/类型转换操作符) HelloWorld! public cl ...

  6. python 类 - 继承

    继承 什么是继承? 编写类时,并非总要从空白开始.如果要编写的类是另一个现成类的特殊版本,可使用继承. 一个类继承另一个类时,将自动获得另一个类的所有属性和方法.现有的类称为父类,而新类称为子类. 子 ...

  7. Features for Multi-Target Multi-Camera Tracking and Re-identification论文解读

    解读一:Features for Multi-Target Multi-Camera Tracking and Re-identification Abstract MTMCT:从多个摄像头采集的视频 ...

  8. LeetCode 23 Hard,K个链表归并

    本文始发于个人公众号:TechFlow,原创不易,求个关注 链接 Merge k Sorted Lists 难度 Hard 描述 Merge k sorted linked lists and ret ...

  9. Go语言实现:【剑指offer】顺时针打印矩阵

    该题目来源于牛客网<剑指offer>专题. 输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字. 例如,如果输入如下4 X 4矩阵:1 2 3 4 5 6 7 8 9 10 11 ...

  10. JS常见的表单验证,H5自带的验证和正则表达式的验证

    H5验证 自带的验证无法满足需求: <form action="" method="get"> name:<input type=" ...