草庐IT

组件mounted第二次不执行

全部标签

javascript - enzyme 浅渲染正在渲染子组件

我正在尝试浅渲染组件以执行一些基本的单元测试。我正在执行此操作的组件有两个子组件,每个子组件根据父组件渲染多次。当查询浅渲染组件时,子元素也被完全渲染,这意味着子元素的HTML元素也可以访问。我正在使用Karma、Browserify、Jasmine和Enzyme,如果需要,可以发布每个的配置。以前有人见过类似的行为吗? 最佳答案 这是正确的行为。与enzyme的其他渲染方法不同的是,它不调用任何生命周期方法,也不转换为真正的html,但它会渲染它的所有子项和子项的子项等等。 关于jav

javascript - React 组件在其 props 方面必须表现得像纯函数吗?

我正在浏览React文档并阅读这一行(粗体显示他们的):AllReactcomponentsmustactlikepurefunctionswithrespecttotheirprops.这是避免意外行为的严格要求还是设计原则?Facebook提供的“不纯”函数示例是修改其输入的函数。但是React组件似乎可以修改它作为输入接收的Prop(我已经从他们自己的示例中复制了下面的示例)。CodePen:ImpureComponentw/RespecttoProps?JSX代码:varWithdraw=React.createClass({render(){this.props.accoun

javascript - angular 2 ngfor 在数组中显示组件

我有一个组件数组,我想显示该数组中的现有组件,但它不起作用,我怀疑在ngfor中创建并显示了一个新组件,而不是数组中的组件,因为我确实看到了新组件组件已创建但具有默认值而不是传递给它们的当前值,我做错了什么?html:typescript:if(this.visualDivArray.length 最佳答案 让您的VisualTextDivComponent创建一个对象数组。将该数组传递给ngFor。然后将数组的每个项目传递到您的app-visual-text-div组件中,如下所示:curLineCounter或更好的名称,是ap

javascript - 容器组件是否应该*始终*连接​​到 Redux?

我即将开始一个新的React项目,并尝试利用我以前的知识来创建一些关于我如何构建应用程序的规则。有些事情我认为是真的:Redux保存整个应用程序的“主要”数据如果需要跨应用程序共享,Redux可以保存UI状态(例如,可以从任何地方启动的全局模态窗口)如果不需要在应用中的其他任何地方共享该状态,则组件可以使用setState保持它们自己的状态。应尽可能使用无状态组件当我创建一个需要来自Redux的状态的组件时,我将创建FooContainer.js和FooComponent.js文件-Redux连接代码将位于容器中.应用程序的很大一部分是UI繁重的,并且有很多UI逻辑/状态正在进行,但不

javascript - 谁执行 unicode 规范化以及何时执行?

根据JavaScript-权威指南,JavaScriptassumesthatthesourcecodeitisinterpretinghasalreadybeennormalizedandmakesnoattempttonormalizeidentifiers,strings,orregularexpressionsitself.TheUnicodestandarddefinesthepreferredencodingforallcharactersandspecifiesanormalizationproceduretoconverttexttoacanonicalformsuit

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 - React/Mobx - 组件正在重新渲染,但未调用 componentWillReceiveProps()

我有React/Mobx应用程序。当我在商店中进行更改时,组件正在更新(重新渲染),但我需要进行一些比较以添加更多功能,因此我想使用componentWillReceiveProps(nextProps)并将nextProps与this.props进行比较。不知何故,它没有被调用。任何想法,我做错了什么,或者我还能做些什么来获得它? 最佳答案 tl;dr:使用componentWillUpdate和componentDidUpdate作为prop传递的对象Store永远不会改变,即使它的内容发生变化。使用@observable的技巧

javascript - 基于组件的架构 [Javascript]

问。在没有任何框架的情况下使用vanillajavascript-什么是基于大规模组件的架构的模式?我理解将组件拆分成单独的部分并拥有自己的结构、方法和API的想法。但是我不知道如何将它们联系在一起。业务逻辑在哪里?您如何构建项目,在哪里包含所有方法等。我的经验是单一的,所有的东西都耦合得太紧了。对此的任何澄清将不胜感激,感觉就像我在原地转圈。注意:当我谈论基于组件的架构时,我指的是thisidea 最佳答案 你可以阅读更多关于Object-Pattern和Module-Patternhttps://learn.jquery.com

javascript - 如何动态执行/评估包含 ES6 模块/需要某些依赖项的 JavaScript 代码?

我希望我的用户能够在我的JavaScript应用程序中使用JavaScript作为脚本语言。为此,我需要动态执行源代码。动态执行JavaScript似乎有两个主要选项:a)使用eval(...)方法(或varfunc=newFunction(...);)。b)添加节点到DOM(例如使用$('body').append(...))。只要我不使用任何import,这两种方法都可以正常工作动态执行的源代码中的语句。如果我包括import语句我收到错误消息Unexpectedidentifier.要执行的示例用户源代码:importAtomfrom'./src/core.atom.js':wi

javascript - Chromeless - 在执行指令之前等待

我正在使用Chromeless在网站上检索一条信息并加载相应的文件:asyncfunctionrun(){constchromeless=newChromeless()constscreenshot=awaitchromeless.goto('http://www.website.com')title=awaitchromeless.inputValue('input[name="title"]')varfs=require('fs');vardata=fs.readFileSync(title,"utf8");...awaitchromeless.end()}但是文件读取指令是在我启