- createElement参数createElement接收的参数:createElement(标签名(必需), 与模板中属性对应的数据对象(可选), 子级虚拟节点(可选)); 深入数据对象{ // 与 `v-bind:class` 的 API 相同,接受一个字符串、对象或字符串和对象组成的数组 class: { foo: true, bar: false }, // ... createElement参数createElement接收的参数:createElement(标签名(必需), 与模板中属性对应的数据对象(可选), 子级虚拟节点(可选)); 深入数据对象{ // 与 `v-bind:class` 的 API 相同,接受一个字符串、对象或字符串和对象组成的数组 class: { foo: true, bar: false }, // ...
- 渲染函数 基础当我们需要使用JavaScript的编程能力时,可以利用渲染函数。渲染函数比模板更接近于编译器。例如,我们想要生成一些标题:<h1>Hello world!</h1>如果,我们按照之前的方式,那么模板内将会十分冗余。如果此时利用渲染函数,那么代码写起来将会简洁很多。props: { level: { type: Number, required: true }... 渲染函数 基础当我们需要使用JavaScript的编程能力时,可以利用渲染函数。渲染函数比模板更接近于编译器。例如,我们想要生成一些标题:<h1>Hello world!</h1>如果,我们按照之前的方式,那么模板内将会十分冗余。如果此时利用渲染函数,那么代码写起来将会简洁很多。props: { level: { type: Number, required: true }...
- 过滤器自定义过滤器,用于一些常见的文本格式化。过滤器可用在两个地方:双花括号插值 和 v-bind 表达式,添加在JS表达式的尾部,由“管道”符号表示: <!-- 在双花括号中 --> {{ message | filter }} <!-- 在 v-bind 中 --> <div v-bind:id="id | filter"></div> 定义过滤器全局过滤器:Vue.filter('f... 过滤器自定义过滤器,用于一些常见的文本格式化。过滤器可用在两个地方:双花括号插值 和 v-bind 表达式,添加在JS表达式的尾部,由“管道”符号表示: <!-- 在双花括号中 --> {{ message | filter }} <!-- 在 v-bind 中 --> <div v-bind:id="id | filter"></div> 定义过滤器全局过滤器:Vue.filter('f...
- 很多Vue的初学者想尝试这个框架时,都被webpack过于复杂的配置所吓倒,导致最后无法跑出一个期望的hello word效果。今天我就把我第一次使用webpack打包一个Vue Hello World应用的所有步骤详细记录下来,供Vue的初学者参考。安装nodejs和npm,这两个就不用说了,网上很多教程。本地随便新建一个文件夹,进入后运行命令npm init, 一路next下去,自动生成... 很多Vue的初学者想尝试这个框架时,都被webpack过于复杂的配置所吓倒,导致最后无法跑出一个期望的hello word效果。今天我就把我第一次使用webpack打包一个Vue Hello World应用的所有步骤详细记录下来,供Vue的初学者参考。安装nodejs和npm,这两个就不用说了,网上很多教程。本地随便新建一个文件夹,进入后运行命令npm init, 一路next下去,自动生成...
- 2017年3月28日,我到国内一个SAP CRM客户那里,同他们的架构师关于二次开发的UI框架选择SAP UI5还是Vue进行了一番探讨。回到SAP研究院之后,我把这个问题扔到了公司的微信群里,引起了大家的热烈讨论。因为出差回来之后,我需要向我老板和老板的老板汇报工作,因此写了这篇blog:https://blogs.sap.com/2017/03/31/is-jquery-based-ui... 2017年3月28日,我到国内一个SAP CRM客户那里,同他们的架构师关于二次开发的UI框架选择SAP UI5还是Vue进行了一番探讨。回到SAP研究院之后,我把这个问题扔到了公司的微信群里,引起了大家的热烈讨论。因为出差回来之后,我需要向我老板和老板的老板汇报工作,因此写了这篇blog:https://blogs.sap.com/2017/03/31/is-jquery-based-ui...
- Vue 常用指令讲解指令(Directives)是带有 v- 前缀的特殊属性,指令属性的值一般是单个JavaScript表达式(v-for除外)。指令的功能是,当表达式的值改变时,将其产生的连带影响,响应式地作用于DOM。常用的Vue指令有:①:el挂载点1.el是用来设置Vue实例挂载(管理)的元素2.Vue会管理el选项 命中的元素 以及内部的 后代元素3.可以使用其他的选择器,但是... Vue 常用指令讲解指令(Directives)是带有 v- 前缀的特殊属性,指令属性的值一般是单个JavaScript表达式(v-for除外)。指令的功能是,当表达式的值改变时,将其产生的连带影响,响应式地作用于DOM。常用的Vue指令有:①:el挂载点1.el是用来设置Vue实例挂载(管理)的元素2.Vue会管理el选项 命中的元素 以及内部的 后代元素3.可以使用其他的选择器,但是...
- Vue 留言板 升降序功能要求使用Vue完成留言板案例;使用文本域编辑留言内容,点击提交按钮,将留言信息展示在留言框下方的列表中;留言列表中显示留言内容和留言时间;创建两个按钮,分别显示降序和升序,点击不同的按钮,对留言列表进行重新排序,按照发布时间排序;(留言列表为数组、每条留言内容是一个对象,参考TodoList案例)<!DOCTYPE html><html lang="en"><... Vue 留言板 升降序功能要求使用Vue完成留言板案例;使用文本域编辑留言内容,点击提交按钮,将留言信息展示在留言框下方的列表中;留言列表中显示留言内容和留言时间;创建两个按钮,分别显示降序和升序,点击不同的按钮,对留言列表进行重新排序,按照发布时间排序;(留言列表为数组、每条留言内容是一个对象,参考TodoList案例)<!DOCTYPE html><html lang="en"><...
- Vue实现todolist localStorage 时间过滤<template> <div> <input type="text" v-model="inputVal" @keyup.13="add" /> <!-- 未完成 --> <h4>未完成</h4> <ul> <li v-for="(item,index) in nolist" :key=... Vue实现todolist localStorage 时间过滤<template> <div> <input type="text" v-model="inputVal" @keyup.13="add" /> <!-- 未完成 --> <h4>未完成</h4> <ul> <li v-for="(item,index) in nolist" :key=...
- axios在Vue中的使用方法 1.基本用法安装axioscnpm i axios --save在mian.js 中引入axiosimport axios from 'axios'Vue.prototype.$axios = axios使用axios<script> export default { mounted(){ this.$axios.get('/goods.json').... axios在Vue中的使用方法 1.基本用法安装axioscnpm i axios --save在mian.js 中引入axiosimport axios from 'axios'Vue.prototype.$axios = axios使用axios<script> export default { mounted(){ this.$axios.get('/goods.json')....
- Vue + element-ui 实现 分页 重置 搜索 时间处理 项目需求实现学生管理页面的json数据渲染实现创建时间的处理实现分页功能根据学员状态,进行搜索点击重置恢复渲染全部学员根据学员名称进行搜索根据手机号进行搜索实现user路由下的二级路由跳转 “学员管理” 和 “讲师管理”效果图如下:用element-ui实现布局:<template> <div> ... Vue + element-ui 实现 分页 重置 搜索 时间处理 项目需求实现学生管理页面的json数据渲染实现创建时间的处理实现分页功能根据学员状态,进行搜索点击重置恢复渲染全部学员根据学员名称进行搜索根据手机号进行搜索实现user路由下的二级路由跳转 “学员管理” 和 “讲师管理”效果图如下:用element-ui实现布局:<template> <div> ...
- 我们在vue3.0中配置转发是新建vue.config.js里配置(和package.json同级)今天在用2.0写代码的时候,一直转发不成功 500 错误2.0项目中的转发是在 bulid文件夹下 webpack.base.conf.js 里配置:3.0里新建文件vue.config.js; 我们在vue3.0中配置转发是新建vue.config.js里配置(和package.json同级)今天在用2.0写代码的时候,一直转发不成功 500 错误2.0项目中的转发是在 bulid文件夹下 webpack.base.conf.js 里配置:3.0里新建文件vue.config.js;
- 上节我们简单简单介绍了一下自定义指令是什么,这节课我们好好讲解下自定义指令里函数的应用~ 钩子函数自定义指令对象提供了钩子函数供我们使用,这些钩子函数都为可选。 bind只调用一次,指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。 inserted被绑定元素插入父节点时调用(仅保证父节点存在,但不一定已被插入文档中)。 update所在组件的 VNode 更新时调用,但是可能发... 上节我们简单简单介绍了一下自定义指令是什么,这节课我们好好讲解下自定义指令里函数的应用~ 钩子函数自定义指令对象提供了钩子函数供我们使用,这些钩子函数都为可选。 bind只调用一次,指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。 inserted被绑定元素插入父节点时调用(仅保证父节点存在,但不一定已被插入文档中)。 update所在组件的 VNode 更新时调用,但是可能发...
- Vue多环境配置--切换生产环境、测试环境和开发环境 Vue多环境配置--切换生产环境、测试环境和开发环境
- 一、代码 vue2类型写法<template> <ul> <!-- 普通循环 --> <li v-for="value in arr">{{ value }}</li> <!-- 健值循环 --> <!-- key指定唯一性 --> <li v-for="(item, index) in users" :key="index"> {{ index ... 一、代码 vue2类型写法<template> <ul> <!-- 普通循环 --> <li v-for="value in arr">{{ value }}</li> <!-- 健值循环 --> <!-- key指定唯一性 --> <li v-for="(item, index) in users" :key="index"> {{ index ...
- 一、代码<template> <!-- 数据绑定 --> {{msg}}----{{arr}}----{{age}}----{{users}} <br/> <!-- 双向数据绑定 --> <input type="text" v-model="name"> <br/> <select v-mo... 一、代码<template> <!-- 数据绑定 --> {{msg}}----{{arr}}----{{age}}----{{users}} <br/> <!-- 双向数据绑定 --> <input type="text" v-model="name"> <br/> <select v-mo...
上滑加载中
推荐直播
-
HDC深度解读系列 - Serverless与MCP融合创新,构建AI应用全新智能中枢2025/08/20 周三 16:30-18:00
张昆鹏 HCDG北京核心组代表
HDC2025期间,华为云展示了Serverless与MCP融合创新的解决方案,本期访谈直播,由华为云开发者专家(HCDE)兼华为云开发者社区组织HCDG北京核心组代表张鹏先生主持,华为云PaaS服务产品部 Serverless总监Ewen为大家深度解读华为云Serverless与MCP如何融合构建AI应用全新智能中枢
回顾中 -
关于RISC-V生态发展的思考2025/09/02 周二 17:00-18:00
中国科学院计算技术研究所副所长包云岗教授
中科院包云岗老师将在本次直播中,探讨处理器生态的关键要素及其联系,分享过去几年推动RISC-V生态建设实践过程中的经验与教训。
回顾中 -
一键搞定华为云万级资源,3步轻松管理企业成本2025/09/09 周二 15:00-16:00
阿言 华为云交易产品经理
本直播重点介绍如何一键续费万级资源,3步轻松管理成本,帮助提升日常管理效率!
回顾中
热门标签