前端

Vue中的内置指令与自定义指令

一、内置指令 1、v-text指令 :向标签中添加文本 2、v-html指令:向指定恒点中渲染包含html结构的内容。 2-1、与插值语法的区别: (1).v-html会替换掉节点中所有的内容,{{xx}}则不会 。 (2).v-html可以识别html结构。 2-2、严重注意: v-html有安全性问题!!! (1).在网站上动态演染任查HTML是非常危险的,容易导致XSS攻击。 (2).定要

584. 【前端】style-loader和MiniCssExtractPlugin.loader

style-loader和MiniCssExtractPlugin.loader是Webpack中常用的用于处理CSS的loader之一。 style-loader将CSS代码以内联样式的形式插入到HTML页面的<head>标签中。使用style-loader的好处是,样式可以立即应用于页面,并且可以动态更新,例如在JavaScript中使用style属性更改元素的样式时,这些更改可以

WEB前端优化实践

提升首屏的加载速度,是前端性能优化中最重要的环节,这里笔者梳理出一些 常规且有效 的首屏优化建议 目标:通过对比优化前后的性能变化,来验证方案的有效性,了解并掌握其原理 1、路由懒加载 SPA 项目,一个路由对应一个页面,如果不做处理,项目打包后,会把所有页面打包成一个文件,当用户打开首页时,会一次性加载所有的资源,造成首页加载很慢,降低用户体验。 列一个实际项目的打包详情:

Pinia的简单使用

1.什么是Pinia? 1.pinia 和 vuex 具有相同的功效, 是 Vue 的存储库,它允许您跨组件/页面共享状态。 2.设计使用的是 Composition api,更符合vue3的设计思维。 3.Pinia 对 Vue 2 和 Vue 3 都有效,并且不需要您使用组合 API。 2.Pinia 的使用 2.1 Pinia 的安装 在安装Pinia的时候可以使用yarn 也可以使用 np

基于uniapp的简单TodoList应用程序实现

1. 前言 本章将介绍如何使用uniapp开发一个简单的TodoList应用程序。通过这个项目实践,你将巩固所学的uniapp基础知识和技能,并且了解如何将它们应用到实际开发中。 2. 项目概述 我们要实现一个TodoList应用程序,它具有以下功能: 添加待办事项 查看待办事项列表 标记已完成事项 删除事项 3. 页面设计 为了实现上述功能,我们需要创建两个页面:添加待办事项页面和待办事项列

蓝桥第四课-新增商品页面开发以及接口调用

这节课来实现新增商品,首先是点击【添加商品】按钮实现跳转页面,在定义点击方法跳转页面之前,要先新建一个页面addShop 在【src/views/shopModel】文件夹下,新建一个【addShop】文件夹,在文件夹内新建【index.vue】 在【index.vue】内敲快捷键vbase(前提是你的vscode已经安装了Vue VSCode Snippets插件),快速生成vue组件基础结构

vue经典面试题

vue经典面试题 vue指令中,双向数据绑定是哪个指令,请说出其原理? v-model 是数据双向绑定是通过数据劫持结合发布订阅模式的方式来实现的,数据和视图是同步的,数据发生变化,视图跟着变化。视图变化,数据也随之发生变化。 核心是Object.defineProperty(),有三个参数:obj(定义其上属性的位置)、prop(要定义或者修改的属性)descript(具体的改变方法) co

iOS开发 APP跳转到设置或系统页面

iOS10以前 打开设置应用: UIApplication.openSettingsURLString 打开通用设置: App-Prefs:root=General 打开关于本机: App-Prefs:root=General&path=About 打开软件更新: App-Prefs:root=General&path=SOFTWARE_UPDATE_LINK 打开网络设

Vue3的setup基础

基本使用 setup内部定义的变量可通过return返回,这些变量和方法便可在模板中使用 基本使用 setup内定义的变量本事不具有响应式,即修改其内容时,页面不会发生改变,只有通过ref(基本数据类型)和reactive(复杂数据类型)才能让这些变量具有响应式。 赋予变量响应式 父子组件传值 父传子 子组件 父组件及效果 子传父 子组件调用父组件方