大学生涯
未读一. Promise1. 异步异步：则是将耗时很长的 A 交付的工作交给系统之后，就去继续做 B 交付的工作，等到系统完成了前面的工作之后，再通过回调或者事件，继续做 A 剩下的工作。AB 工作的完成顺序，和交付他们的时间顺序无关，所以叫“异步”。 2. 回调函数当一个函数作为参数传入另一个函数中，并且它不会立即执行，只有当满足一定条件后该函数才可以执行，这种函数就称为回调函数。我们熟悉的定时器和 Ajax 中就存在有回调函数. 12345<script> setTimeout(() => { console.log(`执行了回调函数`); }, 3000);</script> 这里的回调函数是() => {console.log( 执行了回调函数 )}，在满足时间 3 秒后执行。 3. 异步函数123456<script> setTimeout(() => { console.log(`执行了回调函数`); }, 3000); console.log(`11 ...
大学生涯
未读1 let 与 const、块级作用域在 ES6 之前 JS 是没有块级作用域的，const 与 let 填补了这方面的空白，分别使用 let、const 声明变量和常量，const 与 let 都是块级作用域。使用 var 定义的变量为函数级作用域：使用 let 与 const 定义的变量为块级作用域 123456789{ var i = 0; var i = 1; let j = 0; const k = 1;}console.log("i:" + i); // 正常输出 i = 1;//console.log("j:" + j); // 报错,Uncaught ReferenceError: j is not defined//console.log("k:" + k); // 报错,Uncaught ReferenceError: K is not defined 2 函数参数默认值ES6 支持在定义函数的时候为其设置默认值：传值覆盖，空值默认格式：function 函数名称(参数名称 1 ...
大学生涯
未读透传 attribute“透传 attribute”指的是传递给一个组件，却没有被改组件声明为 props 或 emits 的 attribute 或者 v-on事件监听器。最常见的例子就是 class、style和 id。 当一个组件以单个元素为根作渲染时，透传的 attribute 会自动被添加到根元素上。 注意：: 必须是唯一根元素 禁用属性继承123export default { inheritAttrs: false,}; 举例123456789101112131415<script> export default { inheritAttrs: false }</script><template> <h3>透传属性</h3></template><style scoped>.attr-container { color: red;}</style> 生命周期每个组件在被创建时 ...
大学生涯
未读组件传递数据_props组件与组件之间不是完全独立的，而是有交集的，那就是组件与组件之间可以传递数据的。传递数据的解决方案就是 props。 App.vue1234567891011121314151617181920<script> import parent from './components/parent.vue'; export default { name: 'App', components: { parent, } }</script><template> <div id="app"> <parent /> </div></template><style></style> parent.vue12345678910111213141516171819<script>import child from ...
大学生涯
未读模板引用(获取 DOM 操作)虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作，但在某些情况下，我们仍然需要直接访问底层 DOM 元素。要实现这一点，我们可以使用特殊的 refattribute。 挂载结束后引用都会被暴露在 this.$refs之上。 1234567891011121314151617181920212223242526<script> /** * 内容改变：{{模板语法}} * 属性改变：v-bind * 事件改变：v-on */ export default { data() { return { content: "内容" } }, methods: { getElementHandle() { con ...
大学生涯
未读Class 绑定数据绑定的一个常见需求场景式操纵元素的 CSS class 列表，因为 class是 attribute,我们可以和其他 attribute 一样使用 v-bind将它们和动态的字符串绑定。但是，在处理比较复杂的绑定时，通过拼接生成字符串是麻烦且易出错的。因此，Vue 专门为 class的 v-bind用法提供了特殊的功能增强。除了字符串外，表达式的值也可以是对象或数组。 绑定对象12345678isActive: true, hasError: false, classObject: { 'active': true, 'text-danger': true },<p :class="{'active':isActive,'text-danger':hasError}&q ...
大学生涯
未读事件处理我们可以使用 v-on 指令 (通常缩写为 @ 符号) 来监听 DOM 事件，并在触发事件时执行一些 JavaScript。用法为 v-on:click="methodName" 或使用快捷方式 @click="methodName" 事件处理器的值可以是： 内联事件处理器：事件被触发时执行的内联 JavaScript 语句(与 onclick类似) 方法事件处理器：一个指向组件上定义的方法的属性名或是路径。 内联事件处理器内联事件处理器通常用于简单场景 123456789101112131415<script> export default { data() { return { count: 0 } } }</script><template> <h3>内联事件处理器</h3> <b ...
大学生涯
未读模板语法Vue 使用一种基于 HTML 的模板语法，使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML，可以被符合规范的浏览器和 HTML 解析器解析。 文本插值最基本的数据绑定形式是文本插值，它使用的是“Mustache”语法(即双大括号)： 1234567891011121314151617<script>export default { name: 'hello' data() { return { msg: "神奇的语法", hello: "Hello World" } }}</script><template> <h3>模板语法</h3> <p>{{ msg }}</p> <p>&# ...
课外开发
未读数据统计-Excel 报表 工作台今日数据接口WorkSpaceController123456789101112131415161718192021222324@RestController@RequestMapping("/admin/workspace")@Slf4j@Api(tags = "工作台")public class WorkSpaceController { @Autowired private WorkspaceService workspaceService; /** * 查询今日运营数据 */ @GetMapping("/businessData") @ApiOperation(value = "查询今日运营数据") public Result<BusinessDataVO> businessData() { log.info("查询今日运营数据"); ...
课外开发
未读数据统计-图形报表 Apache ECharts介绍Apache ECarts 是一款基于 JavaScript 的数据可视化图标库，提供直观，生动，可交互，可个性化定制的数据可视化图表。 官网地址: https://echarts.apache.org/zh/index.html 入门案例echarts.jshtml 文件营业额统计ReportController123456789101112131415161718192021222324252627282930313233343536373839404142434445464748package com.sky.controller.admin;import com.sky.result.Result;import com.sky.service.ReportService;import com.sky.vo.TurnoverReportVO;import io.swagger.annotations.Api;import io.swagger.annotations.ApiOperation;import lombok.ext ...
