草庐IT

几款实用的VUE移动端UI框架

全部标签

javascript - 如何使用 vue.js 获取所选选项的索引

抱歉新手问题。但是我如何从选择框中获取所选元素的索引并运行函数。我下面的代码不会触发switchView()函数。{{item.title}}我们将不胜感激。已编辑:搬了@change="switchView(index)"来自至,感谢@Phil我需要索引,因为我有几个计算项。我需要根据用户从项目中的选择更改View。 最佳答案 将$event.target.selectedIndex传递给您的函数使用@change指令来监听变化事件。调用您的函数并将$event或事件目标的选定索引$event.target.selectedInd

javascript - 防止横向移动网站

这个问题在这里已经有了答案:Blockingdevicerotationonmobilewebpages(9个回答)关闭5年前。目前,我正在我的网站上工作。移动版快完成了。但是如果我横向旋转我的屏幕(例如智能手机),它看起来很可怕。我试图用查询来改变它,但结果不是很好。有没有办法锁定方向,使其始终保持纵向模式?编辑:我想也许我可以对高度和宽度做点什么。因此,如果屏幕的宽度大于高度,则主体应旋转90度。

javascript - Vue.js "npm run build"但 Vue.js 未绑定(bind)到 DOM/工作

这里是Vue.js的新手。在MacOS上使用版本:$npm--version4.6.1$vue--version2.8.1我正在使用webpack-simpleinit和vue-cliforvue2.0。我在我的Django项目文件夹中为vue内容创建了一个名为frontend的文件夹。目录结构:$tree├──README.md├──asnew│  ├──__init__.py│  ├──migrations│  ├──models.py│  ├──settings.py│  ├──templates│ └──index.html│  ├──urls.py│  ├──views.py

javascript - Vue.js:折叠/展开来自父级的所有元素

我需要为我的Vue组件(一些可折叠面板)添加“全部展开/折叠”功能。如果用户点击折叠按钮,然后点击某个面板并展开它,然后点击折叠按钮将不执行任何操作,因为watched参数不会改变。那么如何正确实现此功能(按钮必须始终折叠和展开组件)?我准备了一个简单的例子(抱歉格式不好,它在编辑器中看起来不错:()):varcollapsible={template:"#collapsible",props:["collapseAll"],data:function(){return{collapsed:true}},watch:{ collapseAll:function(value){ this

javascript - Vue 组件 - 在错误的位置呈现

我在vue组件和内联模板之间看到奇怪的行为。示例#1:内联模板这按预期工作。根据下面的示例#2,vue组件没有变化,唯一的区别是我将模板内容作为内联模板复制到标签中。参见:https://jsfiddle.net/pobffmnv/CurrentClientsClientNameNo.ProjectsTime(7days)EditTest00Edit这正确显示了以下内容:示例#2:非内联以下是我的Vue模板。以下是删除内联模板的代码更改。参见:https://jsfiddle.net/Ld47hoy2/Test00Editexportdefault{}更新页面代码:CurrentCli

javascript - 如何从 Vue.js 中的组件生命周期方法访问 mixin 方法内部的函数

这是一个例子:混入.jsexportdefault{methods:{aFunction(){//Somefunctionalityhere}}}组件.vueimportmixinfrom'./mixin'exportdefault{mixins:[mixin]created(){//CallaFunctiondefinedinthemixinhere}}我想从组件内部的created()生命周期方法访问在mixin方法内部定义的aFunction。 最佳答案 mixin方法与组件的当前实例合并,所以它只是:created(){th

javascript - 在 Material ui的日期选择器中更改格式日期

我使用具有redux形式的material-uidatepicker组件。我在这里遇到了一个小问题,这看起来很神奇。当我更改日期时,它在我的输入字段中显示为yyyy-mm-dd。我想更改它以显示为dd-mm-yyyy。日期选择器有一个名为formatDate的属性,它接受一个函数作为输入。所以我写道:moment().format(DD-MM-YYYY)}/>但是好像不行。你有什么想法吗? 最佳答案 根据DOC:formatDate====>function====>Thisfunctioniscalledtoformattheda

javascript - Vue : when to use @keyup. native in input 元素

我有一个Vue组件一个绑定(bind)v-on:keyup.enter的元素doFilter()的关键一个绑定(bind)v-on:click事件到doFilter()Filter按钮事件将触发doFilter(),但按键事件不会触发,除非我添加.native修饰符。Vue.jsdocumentationsaysthisabout.native:listenforanativeeventontherootelementofcomponent.我什么时候需要使用.native为什么没有它就不会触发keyup事件?更新1:添加codepen和代码可运行演示位于https://codepen

javascript - 来自服务器数据的 Vue2 路由器链接

我有一个Vue2SPA页面,它正在从服务器加载内容。客户可以在CMS中对其进行编辑。当用户添加相对链接(比如说/about-us)时,Vue应该选择它并将其视为菜单链接(已经有/about-us链接)。但是在内容中添加的/about-us链接会重新加载整个页面,因此它不会被选为vue路由。如何将路由器附加到此类链接?到目前为止,我所做的是更改后端响应中的内容。所以我本质上是在改变Text进入Text使用:functionparseVueLinks($value){$pattern="/]*)href=\\\"[^http|https|mailto|tel]([^\\\"]*)\"([^

javascript - react ES6 : Get selected value in dropdown list using semantic UI

给定以下数据,我如何获取鸟类名称并将其推送(使用添加按钮)到一个新数组以显示在另一个div中(使用reactes6)?所以基本上我希望用户从语义下拉列表中单击一只鸟并将其显示在不同的div中,例如如下所示。这可能很简单,但是当我使用语义元素时,我似乎找不到解决方法。我需要使用onChange吗?我需要在我正在导出的类中执行此操作(react)(只是没有显示类/构造函数/状态定义)Howcanidisplay'Bird_Name'here?addClick=()=>{}const{Button,Container,Divider,Dropdown,Header,Message,Segme