草庐IT

Vue-router

全部标签

javascript - 如何在 Vue JS 的单个文件中访问样式内的组件变量

有没有vue插件可以让我们在side中使用模板变量?单个文件组件中的标记,例如{{display}}exportdefault{data(){return{display:'block'}}}body{display:{{display}}}任何更好的方法/插件来做到这一点??我已经知道:style和:class 最佳答案 里面的Vue模型(数据层)我觉得没办法访问在当前版本的Vue.Vue只能控制DOM树,不能帮助您处理CSSOM。您可能正在使用WebPack或其他bundler,并在您拥有的单个文件中编写模块化组件。,,和.您的

javascript - Vue - 如何将父引用作为 Prop 传递给子?

我正在尝试将当前组件的ref传递给这样的子组件:constParent={name:'parent',data:{screenRef:{}},mounted(){this.screenRef=this.$refs['screen']}}由于Vue.js类型不支持HTMLDivElement,当我将screenRef定义为prop时,我在子组件中遇到错误。constChildComponent={name:'child',props:{screen:{type:HTMLDivElement,default:{}}}}有人可以告诉我正确的方法吗? 最佳答案

javascript - 使用 angular-ui-router 处理没有 hashbang 的路由

我在网上搜索了很多答案,但还没有找到任何答案。现在我的文件中有这段代码,我认为它可以处理除我指定的之外的所有路线/状态:$urlRouterProvider.otherwise('/');然而,此功能仅适用于像localhost:1337/#/stuff这样的路径,但如果我输入localhost:1337/stuff,我会得到一个丑陋的内部服务器错误。理想情况下,我希望localhost:1337/stuff或任何其他没有hashbang的URL重定向到localhost:1337/#/(我的应用程序的主页)。我有什么想法可以实现吗? 最佳答案

javascript - React Router 服务器端呈现错误 : Warning: Failed propType: Required prop `history` was not specified in `RoutingContext`

我正在设置一个简单的玩具应用程序来学习React/Hapi,并且一切正常,直到我尝试设置服务器端路由。服务器运行无误,并使用helloworld正确呈现“/”。但是,当我导航到“/test”时,出现以下错误。Warning:FailedpropType:Requiredprop`history`wasnotspecifiedin`RoutingContext`.Warning:FailedpropType:Requiredprop`location`wasnotspecifiedin`RoutingContext`.Warning:FailedpropType:Requiredprop

javascript - 在 Vue.js 中注入(inject) <head>

我有一些外部脚本需要加载到各种页面上,例如GooglePlacesAutocomplete、FacebookAPI等。显然,将它们加载到每条路线上是没有意义的,但是文档并未解决这种相当常见的情况。此外,Vue实例挂载到正文中的标签上,因为themountedelementwillbereplacedwithVue-generatedDOMinallcases.Itisthereforenotrecommendedtomounttherootinstancetoor.现实世界的应用程序目前如何处理这种情况? 最佳答案 我推荐使用htt

javascript - Vue.js 从模板中分离样式

我使用带有的模板出于CMS原因,必须靠近其div的block。当我运行Vue.js时,它似乎删除了样式block,说...-TemplatesshouldonlyberesponsibleformappingthestatetotheUI.Avoidplacingtagswithside-effectsinyourtemplates,suchas,astheywillnotbeparsed.我能做什么?varapp=newVue({el:'#app'});#div_123{background:http://placehold.it/850x150;}@mediascreenand(m

javascript - 带有 Webpack 的 VueJS : imports and exports not working as expected

我启动了一个新的Vuetify/Webpack项目,并尝试通过vueinitvuetify/webpack设置项目后实现vue-router。我根据thistutorial中的说明设置路由器.经过一些摆弄后,我通过更改导入Vue组件的方式使其正常工作。在我的router/index.js文件中://worksformeimportMainfrom'../components/Main.vue'//doesNOTwork;fromthetutorialimportMainfrom'@/components/Main'我的问题是,为什么我必须相对导入我的Main.vue文件并在导入时包含.

javascript - 在 vue.js 模板中包含外部脚本

我是Vue.js和web-pack的新手,所以我决定使用vue-cli(webpack)来构建初始应用程序。我试图在模板中包含一个外部脚本(例如),这在全局范围内(对于每个页面/组件)都不需要,但是Vue警告说这是不允许的。我的index.html文件与最初生成的文件类似:App我的App.vue也和生成的类似:我有一条路线到/upload在我的路由文件中,它映射到需要dropzone.js(外部脚本)的上传组件。我可以将它包含在我的index.html中,类似于加载Bootstrap的方式,但是当只有这个组件需要它时,为每个页面/组件加载它似乎不太理想。但是,如上所述,我无法将它直接

javascript - 将 css 注入(inject) Vue 组件?

见下文my-component.vue。此组件需要可主题化。它需要获取外部css表,因为我需要允许其他开发人员自定义其内部外观。除了acceptajavascriptobject还有其他方法吗??.A{background-color:green;}.B{background-color:red;}.C{background-color:yellow} 最佳答案 在你的组件中:exportdefault{props:{boxStyle:{type:String,default:'box-default'}}}.box-default

javascript - Vue.js 调试消息问题

我在前端使用Vue.jsv2.5.1构建了一个Web应用程序。该应用程序通常运行良好,但是当出现问题时,抛出的错误消息仅引用vue.js代码本身,而不是我的代码部分(我假设我的模板中有一些东西)无疑是实际来源问题。这是一个例子:ErrorinnextTick:"NotFoundError:Failedtoexecute'insertBefore'on'Node':Thenodebeforewhichthenewnodeistobeinsertedisnotachildofthisnode."warn@vue.js?v=1:491logError@vue.js?v=1:600global