草庐IT

Vue-Instant

全部标签

vue实现微信小程序,代码实例以及如何调试

目录1.首先,确保已经安装了VueCLI,然后使用VueCLI创建一个新的Vue项目:2.在项目中安装微信小程序开发依赖:3.在项目中创建一个名为“微信小程序”的文件夹,并在其中创建一个名为“app.vue”的文件。在“app.vue”文件中,编写以下代码:4.在“block.vue”文件中,编写以下代码:5.在项目根目录下,创建一个名为“main.js”的文件,并在其中编写以下代码:6.在命令行中,运行以下命令启动开发服务器:7.打开微信开发者工具,并访问`http://localhost:8080/`。在工具中,可以查看和调试小程序的代码。要调试Vue实现的微信小程序,您需要使用微信开发者

vue3的兄弟传参(三种方法)

1.兄弟A先给父元素父元素再给子组件B(vue2的思路)A组件template>divstyle="width:300px;height:200px;background:blue">button@click="add">A派发事件/button>/div>/template>scriptsetuplang="ts">import{defineEmits}from"vue"//emitconstemit=defineEmits(['onclick']);letflag=false;constadd=()=>{flag=!flag;emit('onclick',flag)}/script>sty

解决Vue+Element UI使用表单rules国际化时From表单验证信息不能实时更新

说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家!博主在工作之余开始进行自动化测试平台的开发,虽然已经996一个月了但是还是在使劲挤时间做这件事情,目前平台使用前端框架vue-element-admin进行简化后二次开发,目前保留了原框架中的国际化、主题色、全局搜索、字体大小以及右侧悬浮设置菜单,更多细节后续会在系列文章中进行更新~问题描述在默认中文时,点击登录或者失去输入框焦点时测试时,表单验证消息没有问题如图1,此时如果切换到英文时就会出现验证信息还是中文的情况如图2所示点击注册按钮切换注册表单,此时会重置表单数据,所以不会出现验证提示信息与语言不符情况解决方法方法1使用

vue实现离线地图+leaflet+高德瓦片

准备工作1、我是通过leaflet和高德的瓦片实现的离线地图2、可以通过npm、CDN和直接下载zip包实现引入leaflet,附上leaflet中文网3、高德的瓦片是找了很多帖子无意看到的一份合适的瓦片下载项目(忘了原帖在哪),不过这个项目是Java项目,是通过后端大哥帮忙下载的,附上项目原地址4、地图支持1-18层级缩放,全部下载的话文件量太大了(估算三千多万个文件,几十G存储),我这边只下载了1-12层级也比较清晰了(图片资源需要放在public文件夹下)开发代码1、HTML部分template>divclass="main">divid="container">div>div>temp

vue3.0 父组件调用子组件方法及获取子组件的值

vue3.0父组件调用子组件方法及获取子组件的值通过对比2.0的获取及调用方式这里我们也可以借鉴2.0中的this.$refs去获取3.0和2.0的refs获取的方式有点大同小异,但是思路还是一样的这里我详细的讲解一下他的调用方式及获取方法1.第一步需要我们在父组件中定义一个方法当我们点击这个方法的时候去调用子组件的方法代码如下//父组件template>sonref="myRefs">/son>button@click="giveParentHandVal">向父组件传值/button>/template>scriptsetuplang="ts">importsonfrom'@/views/

vue简易导出word文档——docxtemplater使用介绍

好久不见,上班时间时间紧急,把领导要写的文档写好复制了一份发给大家(斜眼笑)。一、下载依赖npminstalldocxtemplaterpizzip--save//处理docx模板npminstalljszip-utils--savenpminstalljszip--savenpminstallfile-saver--save//处理输出文件​​二、在public文件夹下创建docx模板UncaughtError:Error:Can'tfindendofcentraldirectory:isthisazipfile?Ifitis,see如果后面步骤报错找不到模板,打开docx文档另存为覆盖当前

前端笔记(4) Vue3 全局属性 app.config.globalProperties 使用案例

Vue3全局属性app.config.globalProperties使用案例1前言2app.config.globalProperties使用1前言学习Vue3有个把月了,记录下学习中的小知识点。首先很多同学还没找到Vue3真正的官方文档,下面给出Vue3的文档网站Vue3官网文档Vue3API文档2app.config.globalProperties使用官方解释:一个用于注册能够被应用内所有组件实例访问到的全局property的对象。案例:首先有一个请求后端接口的方法exportfunctionlistByDictTypeCode(dictTypeCode:string):AxiosPr

【vue-router源码】二、createWebHistory、createWebHashHistory、createMemoryHistory源码解析

【vue-rouer源码】系列文章【vue-router源码】一、router.install解析【vue-router源码】二、createWebHistory、createWebHashHistory、createMemoryHistory源码解析【vue-router源码】三、理解Vue-router中的Matcher【vue-router源码】四、createRouter源码解析【vue-router源码】五、router.addRoute、router.removeRoute、router.hasRoute、router.getRoutes源码分析【vue-router源码】六、ro

40、jenkins部署vue项目

目录前言一、服务器部署分析二、手动部署vue项目1-gitee操作2-启动项目三、nginx中部署vuejs1-静态html生成2-在测试服务器上安装nginx3-挂载nginx的配置4-拷贝项目到nginx下四、jenkins部署vuejs1-freestyle构建2-pipeline构建前言前面我们已经学习了jenkin的持续集成与部署,接下来我们将使用jenkin来部署我们之前已经完成的微服务项目一、服务器部署分析PS特殊说明:ng服务器、go服务器和py服务器,如图所示是各要部署在不同的服务器中的;因为电脑原因,就不分别部署了,都部署到一台服务器中,跟图示的区别是IP地址的不同,其他没

h5跳转微信小程序方案及注意事项(vue方向)

h5跳转微信小程序方案步骤1、准备2、绑定域名(在[微信公众平台](https://mp.weixin.qq.com/)设置)3、IP白名单(在[微信公众平台](https://mp.weixin.qq.com/)设置)4、将小程序和H5公众号进行关联(在[微信公众平台](https://mp.weixin.qq.com/)设置)5、引入JS文件6、通过config接口注入权限验证配置并申请所需开放标签7、传参(VUE、小程序页面)8、全部代码9、注意事项(按钮不显示、点击按钮没反应,请对照以下事项逐一排查)1、准备在正式开发工作之前,请优先熟读并查看微信开发文档。2、绑定域名(在微信公众平台