草庐IT

Vue中JSX的基本用法

全部标签

javascript - 模拟 jQuery 来测试基本使用

我很难理解如何设置允许我测试jQuery调用的对象。我不需要模拟任何异步调用或任何东西,只需基本使用即可。因此,让我列出我要测试的函数(为简单起见被chop):listGamesCallback:function(data){vargameList=$("#gameListselect");gameList.empty();$.each(data,function(){varnewOption=$('',{value:this.gameId});newOption.text(string);newOption.data("isJoinable",isJoinable);//Additt

javascript - 如何在 Vue.js 中保持可排序数组和组件的顺序

我正在使用Vue.js和Dragula制作一个拖放图block页面。每个图block都包含自己的一组数据,因此每个图block都是一个Vue组件。问题是,一旦我拖放其中一个图block,Vue实例中的DOM元素和数据数组就会失去同步并开始引起问题。只是拖放不会产生问题,但是一旦我拖放某些东西然后尝试删除它,一切都会出错。这是一个fiddle:https://jsfiddle.net/wfjawvnL/13/这是我的HTML,带有组件模板:{{$data|json}}{{name}}Index:{{index}}✗这是我的Vue实例:varvm=newVue({el:'#a

javascript - TypeError : str. replace is not a function strange error with vue.js Ajax 调用

我收到一个奇怪的错误:vue-resource.common.jsUncaughtTypeError:str.replaceisnotafunction它似乎与我正在获取一些的ajax调用有关数据:exportdefault{data:()=>({recipes:[]}),ready(){this.$http.get('http://localhost:3000/recipes',{headers:{'Access-Control-Allow-Origin':true}}).then((recipes)=>{this.$set('recipes',recipes)})}};我是vue.

javascript - Vue.js 2 : Conditional Rendering not working

我在使用ConditionalRendering时遇到问题,因为没有一个例子是有效的。这是Vue代码:Vue.component('sub-folder',{props:['folder'],template:'#template-folder-item'});varbuildFoldersList=newVue({el:'#sub-folders',data:{foldersList:this.foldersList,foldersStatus:this.foldersStatus},created(){this.buildFolders()},methods:{buildFolde

javascript - 在 jsx 中的 map 中使用 map

{normalizedData.map(obj=>{obj.display_date_numberic}{!isEmpty(obj.applicants)&&obj.map(obj2=>{obj2.person.name})})}我在以下行中收到错误:{!isEmpty(obj.applicants)&&obj.map(obj2=>为什么我不能在另一个map中使用map功能?normalizedData有一个对象数组,每个obj都有另一个对象数组。 最佳答案 您可以按如下方式在map中创建map:例如给定的数据outerArray:

javascript - Webpack 开发服务器不热重新加载 .vue 文件

一直在做一个项目,并确定HMR正在工作,如果我更新我的任何.js文件,webpack都会编译,并且模块会被替换掉。我正在处理一个.vue文件,webpack会重新编译,但没有super新鲜的HMR。希望有人可以看一下并告诉我是否有问题:我在cli中使用的脚本如下所示。webpack-dev-server--d--watch--output-path./public--config./_src/webpack.config.js--progress--env.dev我猜最重要的一点是:devServer:{contentBase:'public',hot:true,filename:'m

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 - 使用 Node.js 和 restify 进行基本身份验证

我目前正在使用NodeJS和restify开发RESTfulWeb服务.我已使用node-mysql为数据库启动并运行所有内容,但我还想实现HTTP基本身份验证。我只用Apache和一个.htaccess文件做了一次。但是这里的网络服务器带有restify,我这样启动它:varserver=restify.createServer({name:'mywebservice'});restify文档(http://mcavage.me/node-restify/#Bundled-Plugins)中列出了一个身份验证解析器插件,但我不知道如何使用它。req.username值始终设置为匿名,

javascript - 跟踪基本 HTML 表单发布进度

我有一个基本的HTML表单,可以正常提交,根本没有ajax。此表单使用常规邮寄提交到同一文件。我不使用AJAX,因为表单有12个文本字段和至少1个图像,但最多可能有26个图像,而ajax不能同时处理表单和图像,我必须保存到数据库中,而且很多AJAX的额外工作量。问题是我需要以某种方式跟踪表单上传进度。大多数程序员都知道在浏览器的左下角或右下角查看表单提交进度。但大多数人并不知道这一点。所以我想显示一个进度条。问题是我发现所有进度条都使用ajax的XHR请求。由于表单不是ajax,我似乎无法找到跟踪进度的方法。那么有没有办法拦截浏览器内部的提交进度,看看表单上传完成的百分比呢?编辑我在页