草庐IT

Vue-Instant

全部标签

java+ssm+vue.js大学毕业生就业企业推荐系统

大学生企业推荐系统采用B/S结构、java开发语言、以及Mysql数据库等技术。系统主要分为管理员和学生、企业三部分,管理员主要功能包括:首页、个人中心、学生管理、企业管理、招聘信息管理、个人简历管理、应聘职位管理、评价企业管理、交流论坛、系统管理,学生;首页、个人中心、招聘信息管理、个人简历管理、应聘职位管理、评价企业管理,企业;首页、个人中心、招聘信息管理、个人简历管理、应聘职位管理、评价企业管理,前台首页;首页、招聘信息、个人简历、交流论坛、个人中心、后台管理等功能,基本上实现了整个大学生企业推荐系统信息管理的过程。本系统在一般大学生企业推荐系统的基础上增加了最新信息的功能方便学生快速浏

Vue 渲染函数 & JSX

Vue-templateVue官方推荐使用template语法来创建应用,虽然写法像html,但Vue最终会把template解析为render函数返回虚拟DOM,这点可以在VueDevTools中看到:template渲染流程:因此在某些特定情况下,我们可以直接使用render函数来实现我们的组件。示例根据接口返回的数值level,动态渲染标题组件h1~h6。采用Vue的模板语法,实现如下:exportdefault{props:{level:Number,},}不过实现过程有些冗余了。因此我们可以使用render函数来动态返回我们的组件。在此之前我们需要先了解下Vue中的h函数;Vue-R

Vue 组件间通信有哪几种方式

Vue组件间通信主要指以下3类通信:父子组件通信、隔代组件通信、兄弟组件通信1.props/$emit适用父子组件通信props是父组件将值传给子组件,$emit是子组件通过派发事件的方式将值传给父组件2.ref与$parent/$children适用父子组件通信1)ref:如果在普通的DOM元素上使用,引用指向的就是DOM元素;如果用在子组件上,引用就指向组件实例2)$parent/$children:访问父、子实实例,需要注意的是:children是一个数组,因为子组件可能有多个,通过parent和$children可以直接修改父子组件的dataParent.vue{data(){retu

vue3 的一些知识点

vue3支持jsx安装依赖pnpmadd@vitejs/plugin-vue-jsxvite.config.ts中引用插件import{defineConfig}from"vite"importvuefrom"@vitejs/plugin-vue"importvueJsxfrom"@vitejs/plugin-vue-jsx"//https://vitejs.dev/config/exportdefaultdefineConfig({plugins:[vue(),vueJsx({transformOn:true,mergeProps:true,})],})使用jsximport{defineC

vue 批量自动引入并注册组件或路由等等

有时候有大量的组件.vue后缀的,或.js,或.ts文件,需要一个个的手动引入很麻烦,那么你可以尝试这样创建一个index.js本项目使用vue3.x,vue2.x也可以照样用;image.png这里在components里面创建了一个idnex.js文件require.context可以读取文件,第一个参数是指当前文件夹,第二个参数是是否递归遍历寻找子节点设为ture,第三个正则匹配//自动注册,不必一个个导入导出constrequireComponent=require.context(//其组件目录的相对路径'./',//是否查询其子目录,递归查询true,//匹配基础组件文件名的正则表

vue~vuex的使用

存储相关Vuex和本地存储(如localStorage)以及cookie存储(如document.cookie)之间有一些关系,但它们是不同的概念,用于不同的目的。Vuex:Vuex是Vue.js的官方状态管理库,用于在Vue.js应用程序中管理应用程序的全局状态。Vuex主要用于在前端应用程序中存储和管理各种状态,包括用户信息、应用程序配置、数据缓存等。它提供了一个中心化的状态存储机制,可以让不同组件之间共享和同步状态。Vuex的数据存储在内存中,通常不会持久化到硬盘上。本地存储(localStorage):localStorage是浏览器提供的一种本地存储机制,允许你将数据以键值对的形式存

Ant Design Vue Table 嵌套子表格的数据刷新方法

父子组件各自负责,在table中嵌套了子表格后,首次加载表格时,父组件会实例化子组件并传递参数,折叠后再次展开时,只会传递参数,子组件的数据刷新就属于子表格了。如#slot 只刷新数据,利用每次展开都会重新传递参数的特点,向子组件传递参数,然后在子组件中根据参数来决定是否重新加载数据#slot

vue3.0全局变量app.config.globalProperties的使用

app.config.globalProperties是一个用于注册能够被应用内所有组件实例访问到的全局属性的对象。是Vue2中Vue.prototype使用的一种替代,具体用法如下://main.jsimport{createApp}from'vue'importAppfrom'./App.vue'importrouterfrom'./router'importstorefrom'./store'constapp=createApp(App)app.use(store).use(router).mount('#app')app.config.globalProperties.message=

VUE中iframe结合window.postMessage实现跨域通信

什么是iframe?iframe元素会创建包含另外一个文档的内联框架(即行内框架)。什么是postMessage?window.postMessage()方法可以安全地实现跨源通信。通常,对于两个不同页面的脚本,只有当执行它们的页面位于具有相同的协议(通常为https),端口号(443为https的默认值),以及主机(两个页面的模数Document.domain设置为相同的值)时,这两个脚本才能相互通信。window.postMessage()方法提供了一种受控机制来规避此限制,只要正确的使用,这种方法就很安全。使用场景:在一个项目的页面中嵌入另一个项目的页面,两个项目不遵循同源策略(跨域),

Vue2 中使用Swiper构建中间大两边小轮播效果

Swiper是一个功能丰富的“滑动特效”插件:常用的tab切换,banner切换等等,包含各种切换特效,看Demo就非常炫酷。同时,也提供了主流的框架组件版本。然而,最新版的Vue组件只支持在Vue3中使用。查找资料后实践,记录一个Vue2中的使用方式。Swiper的官网介绍也比较清楚,英文官网中是最新的版本的内容,没有找到旧版的文档内容,中文官网可以看到旧版的文档。一、Swiper在Vue2中的使用方法最新的Swiper只支持Vue3,所以在Vue2上要安装旧版本第一步:npm安装正确的版本npmiswiper@6.8.4vue-awesome-swiper@4.1.1第二步:在对应的Vue