vuejs在点击关闭时隐藏模态
嘿,我在 vuejs 组件中有一个表格,看起来像这样(我意识到这里有很多代码,但要担心的是阴影类): Vue.component('profileinfo', { template: ` Profile First: {{firstNameBraintree}} Last: {{lastNameBraintree}} Company: {{companyBraintree}} Email: {{emailBra
0 2023-06-02
编程技术问答社区
如何在带有Vue的组件中使用外部html模板。Laravel 5.3中的js 2.0
我使用的是默认的Laravel 5.3设置 - vue.js 2.0默认配置的新安装. 使用laravel 5.1和vue.js 1.x,我可以轻松地定义诸如和使用browserify的组件来编译. Vue.component('test-component', require('./test-component'); /* test-component.js */ export default{ template:require('./test-component.template.html') } /* test-component.template.html */ Test Component 但是,对于VUE 2,默认值为webpack(尽管browserify也可用,但无法使其正常工作,并且webpack看起来更好).但是我无法使配置工作.
2 2023-05-31
编程技术问答社区
如何在vue.js中使用$ http.post发送文件
如何使用vue.js? 发送文件 以下代码对我不起作用: 当我制作console.log(this.request.file)时,我得到FILE [object File]. 这是.js: uploadData: function(e) { var files = e.target.files[0]; this.request.action = 'upload'; this.reque
0 2023-05-30
编程技术问答社区
在同一服务器(同一端口)上运行vue.js和laravel
我正在使用Laravel作为后端和Vue.js 2作为前端开发一个网站.现在,每次我想运行我的网站时,我都必须使用2命令: php artisan serve 这将在端口8000上运行Laravel服务器 npm run dev 这将在端口8080上运行vue.js服务器 我只能在同一服务器(同一端口)上运行它们,只有一个命令?? 解决方案 如果您使用其中包含的vue.js的laravel应用程序,则无需运行npm run dev. 在您的情况下,您似乎有一个脱钩的前端和后端.在这种情况下,您实际上没有选择主机2个不同的端口或主机名. 如果使用其他域,则可以使用同一端口.例如,您可以将mydomain.com用于前端,然后将api.mydomain.com用于后端/api. 假设您有一个WebPack前端项目,您可以执行npm run build,它将将所有文件编译到DIST文件夹中的静态HTML文件.然后,您只需要将主机配置文件指向此
2 2023-05-29
编程技术问答社区
如何通过Axios将文件发送到Laravel
我需要通过Axios将文件从客户端发布到服务器. 这是我的vuejs代码: methods: { 'successUpload': function (file) { const config = { headers: { 'Content-Type': 'multipart/form-data' } }; axios.post('/Upload/File',file, config).then(function (response) { console.log(response.data); }); } } 这是我用于处理已发送文件的Laravel代码: public function uploadFile(Request $request) { if($request->hasFile('file')) return "It's a File";
4 2023-05-26
编程技术问答社区
如何将PHP变量传递给Laravel blade中的Vue组件实例?
如何将PHP变量的值传递给Laravel Blade文件中的VUE组件? 在我的示例中,我有一个内联模板client-details,我从Laravel获得此视图,所以现在我想将url /client/1随附的id传递给我的Vue实例. 由Laravel加载的组件看起来像: My HTML stuff 安装: Vue.component('client-details', { data(){ return { clientId: null } }, ); 我已经尝试了 :clientId="{{ $client->id }" 但行不通. 解决方案 您必须
4 2023-05-26
编程技术问答社区
vue.js尝试使用phantom.js生成PDF时不会呈现
在这个简单的示例中,用硬编码URL我的vue.js组件不渲染,纯html得到渲染,但我拥有一个组件的所有地方都显得为空白. phantom.js应该正常使用vue.js? var webPage = require('webpage'); var page = webPage.create(); page.viewportSize = { width: 1920, height: 1080 }; page.open("-----------", function start(status) { page.render('test.jpeg', {format: 'jpeg', quality: '100'}); phantom.exit(); }); 快速vue代码想要帮助并进行测试.
4 2023-05-25
编程技术问答社区
如何处理Vue 2对大数据的内存使用(~50 000个对象)。
我正在尝试在Vue 2上实现大量半复合对象集合的表观图.基本上,想法是从DB中收集50 000到100000行之间的任何位置,然后将其动态分析.使用实时过滤器(文本搜索)构建表观.表中的每一行都是可切换的,这意味着单击行更改为"编辑模式",这可以为该特定字段/单元格. . 每个对象都有大约〜100-150个字段/属性,但是在表中的任何给定时刻都显示了一定量的'em(可以实时切换表列).对于大型数据集,DB似乎正在推动约10-100MB的JSON-DATA,在此用例中,这是可以接受的.会议性能不是问题 - 过滤器工作得足够快,并且仅将有限的结果渲染到DOM. . 所有已经有效的,过滤器,列出了〜100行针对过滤器(+"显示100个" - 机制等),但是当我将8000个对象加载到数组中时,我点击了内存限制.这似乎可以保留2千兆字节的RAM,在Chrome停止一起运行JS代码之后(即使奇怪的是,我没有得到任何警告/错误). 我对行进行了基准的内存使用量,似乎约有1000行储存约3
0 2023-05-23
编程技术问答社区
在vue.js 2中,使用v-if和v-show哪个更好?
我正在使用Vue 2的项目中工作.我需要知道在哪种情况下表现更好:使用V-IF或V-Show? 我有一个较长的列表,每个项目的列表都有一个隐藏的表单,我需要显示并隐藏以单击一个包含每个项目列表的按钮. 什么是更好的v-show切换类别的切换类,或用v-if? 添加并删除表单 解决方案 tl; dr 假设问题严格涉及性能: v-show :昂贵的初始负载,便宜的切换, v-if :廉价的初始负载,昂贵的切换. evan您在Vuejs论坛上提供了更深入的答案 v -show总是编译并渲染所有内容 - 它只是在元素中添加"显示:无"样式.它的初始负载成本较高,但是切换非常便宜. Incompareison,V-IF确实有条件:它是懒惰的,因此,如果其初始条件是错误的,则甚至不会做任何事情.这可能是最初的加载时间.当条件为真时,v-if然后将编译并渲染其内容.切换V-IF块实际上撕裂了其中的所有内容,例如V-if内部的组件在切换时被严重破坏和重新创建,因此切
2 2023-05-23
编程技术问答社区
如何在Vue 2中使用vue-currency-input
我正在尝试完成插件 vue-currency-input 使用VUE 2.6. "vue": "^2.6.12", 在文档中仅详细介绍此信息: 兼容性 vue货币输入3.x需要VUE 2.7或VUE 3.对于VUE 2.6 或更早的时候,请使用VUE COMPONTION的VUE货币输入2.x API插件. "与VUE组成API插件一起使用"是什么意思.? 我安装了这些软件包: npm install vue-currency-input npm install @vue/composition-api 然后在main.js文件中,我在import Vue from "vue";之后添加了以下行: import VueCompositionAPI from "@vue/composition-api"; Vue.use(VueCompositionAPI); 然后,我使用以下方式创建组件货币instup.vue:
22 2023-05-23
编程技术问答社区
如何在IIS服务器上配置Vue 2应用程序?
我需要Config IIS服务器和VUE 2应用程序的帮助,我只是在Windows IIS 7 server上构建生产的情况下安装了vue 2 application,所有工作正常,只有一件事不起作用: 当我尝试打开使用链接" example mysite.com/somepage"的任何页面时任何其他路线不起作用! 我认为我需要设置我的httpredirect或类似的东西! 解决方案 从您的信息中,我假设您正在使用history模式,这是我一直在使用的模式,您可以在在这里:
16 2023-05-22
编程技术问答社区
如何通过虚拟目录在IIS上部署Vue.js应用程序?
我需要通过虚拟目录在IIS上部署vue.js应用程序,但是当我部署它时,我必须更改路由以包括虚拟目录名称. 我的原始路线就是这样: export const routes = [ { path: '', component: Default, props: true }, { path: '/Path', component: Path, props: true }, { path: '/Path/:IdPath', component: PathForm, props: true } ]; 但是要工作,我必须更改路线以包括虚拟目录名称,例如: export const routes = [ { path: '/VirtualDirectory', component: Default, props: true }, { path: '/VirtualDirectory/Path', component: Path, prop
16 2023-05-22
编程技术问答社区
为一个div添加多个不同条件的v-if而不重复?
我div vue有多个不同的条件,如果有一个 , 中有多个v-if 类似的东西 我看到了这一点,但可以作为A和条件工作,而不是另一个条件 ,我也看到或条件 但是一个Div中有2个或更多不同的条件? 解决方案 如果您的条件太长,无法将其放入v-if中,只需创建一个计算属性: computed: { any() { return this.isSomething || this.isSomethingElse // || ... } } ,然后在模板中使用它: 其他解决方案 是.他们只是在该div内的不同: one &&
14 2023-05-22
编程技术问答社区
用Vue-CLI创建的应用程序提供一个404页面
我正在使用vue-cli创建VUE应用程序.我不喜欢的一种行为是,任何不存在的URL(例如,localhost:8080/nonexistent/file.html)都可以使用代码200,好像是根:localhost:8080. 这使调试XHR请求有时真的很混乱. 如何使其返回404代码? 解决方案 您要观察到的功能实际上来自 's historyApiFallback ,对未解决的URL响应index.html(用于带有客户端路由的水疗中心).默认情况下在VUE CLI项目中启用了此功能,但是您可以使用Vue Cli devServer config devServer配置: 创建vue.config.js(如果还不存在),则具有以下内容: module.exports = { devServer: { historyApiFallback: false } } 重新启动您的开发服务器(npm run serve).
4 2023-05-22
编程技术问答社区
Bootstrap Vue阻止/取消事件
我有一个来自Bootstrap Vue的B-Form-Select控件的页面. 当我更改此控件的值时,我想执行一个可以取消此事件并不更改值的函数. 使事情变得更复杂,我的选择是在子组件中,我执行的功能在父母中. 儿童组件 public values: any[] = [ { name: 'default'}, { name: 'forbidden'}, { name: 'other option' }, ] {{val.Name}} 父组件: this.property = { name: 'defaul
14 2023-05-22
编程技术问答社区
从Laravel到Vuejs的视频接收问题
我将视频链接存储在数据库中,并将视频存储在public folder中.文件夹描述类似于public/uploads/100/abcd.mp4. 我正在从Laravel方法中读取此视频,并从Vuejs接收此视频,并试图在标签中显示该视频.我还尝试使用直接链接显示视频,例如. ,但是这样我只能显示视频,但是视频进度栏无法正常工作,并且无法以这种方式设置当前时间. 也许我需要以不同的方式在Vuejs中接收视频.请给我一个解决方案.我在这里添加了Laravel方法和VUEJS方法,我尝试接收视频,我不知道这是否是接收视频的正确方法.如果有的话,请给我解决方案. 视频标签 ``` ``` Laravel方法从我获得视频路径并阅读视频并
8 2023-05-22
编程技术问答社区
在Vue中删除一个v-for元素的正确方法是什么?
我有一个带有面板的应用程序,您可以拖动所有这些都是从类似名称的基本数组中生成的: import Nametag from "@/components/Nametag.vue"; module.exports = { name: 'seating', components: { Nametag }, data () { return { guests: ['Vanessa', 'Lillie', 'Olivia'] } } }; nametag是一个组件,所有代码都将其拖动在屏幕上. x和y位于其数据对象的一部分. 我正
12 2023-05-22
编程技术问答社区
如何使用vue-pdf从受保护的端点消费八位数流,这是pdfjs的vuejs实现。
我想使用 使用Axios从OAuth2保护的端点下载PDF 使用vue-pdf库渲染PDF(八位字节) 棘手的部分是 访问受保护的资源 渲染pdf作为八位字节 当前,存储库中没有显示这些案例的示例. 解决方案 摆弄图书馆后,我设法使用以下方法从受保护的端点实现了PDF的渲染 使用必要的auth标头和响应类型responseType: 'blob' 向受保护资源提出Axios Ajax请求 神奇地从下载的blob对象创建一个URL 将blob URL设置在数据变量中,然后由组件 使用该变量 我已经创建了一个 vue-pdf 存储库带有一个工作示例.在PR中,用返回octet-stream的REST端点替换axios请求的URL,您应该很好. 如下所示的PDF查看器
0 2023-05-22
编程技术问答社区
如何在WebPack和Vuejs中使用工具栏使用完整的PDF.JS查看器?
我正在使用vue.js spa和webpack,试图与mozilla的pdf.js一起显示PDF.我得到了示例 很容易工作,但我很难通过工具栏吸引完整的观众在职的.我需要使用require('pdfjs-dist/webpack')的PDFJ,因此它不会发送"已设置为假工子"的警告.我真的找不到这样的问题/指南或视频,该视频解释了如何使用WebPack使用完整的查看器.这个项目的文档几乎不存在,我想我也尝试了所有可以找到的东西. 对不起,如果这似乎是一个愚蠢的问题,但是我很挣扎了很大的时间,并单击了我可以通过Google搜索找到的每个链接. 预先感谢 我已经从示例中拥有的代码: var PDFJS = require('pdfjs-dist/webpack'); const url = 'the-url-to-my-pdf'; const canvasContainer = document.getElementById('preview'); f
0 2023-05-22
编程技术问答社区