草庐IT

Vue的组件化编程

全部标签

javascript - 如何在 Vue Js 中将数据值从一个组件更改为另一个组件?

我是VueJs的新手。因此,我面临着从另一个组件更改数据值的问题。我有一个组件A:SomethingimportBfrom'../components/B.vue';exportdefault{components:{B},methods:{test:function(){B.data().myData=124B.data().isActive=trueconsole.log(B.data().myData);console.log(B.data().isActive);}}}组件B:exportdefault{data(){return{myData:123,isActive:fal

javascript - v-html 中的 Vue 组件/元素

我有一个post.text数据,其中包含用户提交的博客文章的文本就像在Twitter中一样,用户可以使用语法提及其他用户,我正在标记@user1在这篇文章中。呈现帖子时,我想用指向所提及用户页面的链接替换所有@username实例。通过正则表达式匹配/替换,我可以轻松地将提到的@username转换成类似的东西(我正在使用vue-router):Iamtagging{{dPost.user_name}}inthispost但是当我这样使用它时:vue不会重新处理html来绑定(bind)它自己的标签。如何解决这个问题?谢谢 最佳答案

javascript - 是否值得惯用编程?一个 ES6 例子

关闭。这个问题是opinion-based.它目前不接受答案。想要改进这个问题?更新问题,以便editingthispost可以用事实和引用来回答它.关闭4年前。Improvethisquestion编程是关于如何实现任何代码段的决策。根据这些决定,代码将或多或少具有可读性、高效性、复杂性等。一个常见的决定也是或多或少地符合习惯,即使用特定的语句或您的编程语言或范例。作为概念证明,我用Javascript开发了两个代码片段来分析性能。目标是生成tagA|tagB|tagC形式的字符串,其中tagX的数量是随机的,后缀A、B,C为随机整数。而且,tagX不能重复。第一个实现更为地道,而第

javascript - v-for 循环中的 Vue.js 引用

我尝试在v-for循环中使用组件并初始化ref以便将来从父级访问其中的一些方法。这是我的案例的简化代码:{{msg}}importListItemfrom"./ListItem";exportdefault{name:"HelloWorld",components:{ListItem},data(){return{msg:"WelcometoYourVue.jsApp",items:[{id:1,text:"foo"},{id:2,text:"bar"},{id:3,text:"baz"},{id:4,text:"foobar"}]};},mounted(){setTimeout(()

javascript - Bootstrap Vue 表 : show details when row clicked

尝试实现与文档体验不同的体验:不是通过单击按钮显示行详细信息,而是在单击行时显示行详细信息。并且文档缺乏关于如何使其与示例不同的详细信息。hello这是我的功能,但我认为它根本不起作用expandAdditionalInfo(row){row.showDetails();} 最佳答案 很难找到...但只需添加:@row-clicked="item=>$set(item,'_showDetails',!item._showDetails)"说明即使_showDetails不存在,$set也会保留react性。遗憾的是行对象不可访问,所

javascript - 嵌套归约函数/递归/函数式编程/树遍历

我经常遇到这样的情况:我最终嵌套了很多reduce函数来深入研究一个对象。很难提取逻辑,因为在底部我需要访问沿途遍历的各种键。本质上,我正在寻找一种更好的方法来实现以下目标:import{curry}from'lodash/fp'import{fromJS}from'immutable'constreduce=curry((fn,acc,it)=>it.reduce(fn,acc))describe('reduceNested',()=>{constinput=fromJS({a1:{b1:{c1:{d1:{e1:'one',e2:'two',e3:'three'},d2:{e1:'o

javascript - 在子组件上 react 过时的错误日期

我正在尝试使用表单输入元素,由于我们使用了jQueryUIDatePicker,这些元素是不受控制的和jQuerymaskMoney,一旦用户键入对该字段无效的内容,就会在它们下面呈现错误,并禁用任何错误上的按钮。出于某种原因,noneofthatisworkingright.主要成分类似于下面的内容:classMainComponentextendsReact.Component{constructor(props){super(props)this.state={payrates:[newPayRate(newDate(2019,2,1),0.00),],errors:{rate:

javascript - 默认情况下,Vue 是否为 XSS 提供安全性或防止 XSS?

我在想办法保护自己,Angular视觉react对抗XSS攻击。当我访问Angular官方文档时,https://angular.io/guide/security,它说:TosystematicallyblockXSSbugs,Angulartreatsallvaluesasuntrustedbydefault.WhenavalueisinsertedintotheDOMfromatemplate,viaproperty,attribute,style,classbinding,orinterpolation,Angularsanitizesandescapesuntrustedva

javascript - Javascript 好的编程风格的简单示例?

我正在为Javascript苦苦挣扎。我的大部分问题都不是由于缺乏对语言的理解而引起的(好吧,那也是,但请耐心等待)。相反,主要问题是了解什么是好的编程/代码组织风格。例如,我需要在页面中包含不同的实体(表单、文本区域、表格等),并根据事件(用户触发或Ajax)修改它们。我的第一个想法是为每个实体定义一个类,在这些类的原型(prototype)上定义方法,然后实例化将它们绑定(bind)到特定HTMLid的类(隐式地或在使用new实例化时),并在事件和事件之间注册处理程序方法调用。换句话说,有点像“QT风格”。我很快意识到这不是微不足道的。您不能将对象方法直接注册为回调,您必须将它们包

javascript - 以编程方式创建一个 javascript 函数

youtubeapi//onStateChange回调函数需要这个!我想以编程方式创建函数来监听多个YouTube播放器发出的“onStateChange”事件。添加监听器已经有效:functiononYouTubePlayerReady(playerId){varytpStateManager=playerId+"_StateManager";document.getElementById(playerId).addEventListener("onStateChange",ytpStateManager);...我需要根据playerId变量(“ytp_1”、“ytp_2”、...