草庐IT

Component

全部标签

javascript - Angular 2 同一页面上有多个组件

我正在使用app.component.ts文件中的Angular2快速入门代码。文件看起来像这样:import{Component}from'angular2/core';@Component({selector:'app',template:`TitleHere'})exportclassAppComponent{}这按预期工作。我想做的是在同一个页面上添加另一个组件...所以我尝试了这个:import{Component}from'angular2/core';import{ComponentTwo}from'angular2/core';@Component({selector:

javascript - 如何使用 Vue js 2 在组件子组件链上冒泡事件?

我的vue应用程序使用:由组件子组成的组件父组件在component-parent里面我有按钮,当有人点击一个按钮时我想发出一个事件以便由vue处理并传递给另一个组件到目前为止我做了什么:varvm=newVue({el:'#app',methods:{itemSelectedListener:function(item){console.log('itemSelectedListener',item);}}});Vue.component('component-child',{template:'Button',methods:{chooseItem:function(pty){co

javascript - React 在使用 ErrorBoundary 捕获后仍然显示错误

我的React应用程序正在捕获错误并正确显示我的自定义错误消息,但一秒钟后它仍然显示原始错误日志记录。因此,后备UI随后会被初始错误屏幕所取代。测试组件:importReact,{Component}from'react';exportclassTestextendsReact.Component{constructor(props){super(props);}render(){return();}}错误组件:importReact,{Component}from'react';exportclassErrorextendsReact.Component{constructor(pr

javascript - 没有 JSX 的 React.js - "Warning: Something is calling a React component directly. Use a factory or JSX instead"

我试图在没有JSX的情况下使用React.js组件并收到这样的警告:警告:某些东西正在直接调用React组件。改用工厂或JSX。请参阅:http://fb.me/react-legacyfactory我访问过链接,但建议的createFactory解决方案对我没有帮助:/app.jsvarReact=require('react/addons');varTagsInput=React.createFactory(require('./tagsinput'));//noluckvarTagsComponent=React.createClass({displayName:"TagsCom

javascript - ReactJS + 终极版 : How to structure action creators down to each component?

我有一个名为App.js的父组件:...render(){return({React.cloneElement(this.props.children,this.props})}...functionmapDispatchToProps(dispatch){return(actions:bindActionCreators(actions,)}exportdefaultconnect(...,mapDispatchToProps)(App)并且Prop将传递给每个组件。我想让每个组件都有它的actioncreators文件,但是我怎样才能将所有actioncreators绑定(bind

javascript - react : Do children always rerender when the parent component rerenders?

据我所知,如果一个父组件重新渲染,那么它的所有子组件都会重新渲染,除非它们实现了shouldComponentUpdate()。.我madeanexample这似乎不是真的。我有3个组件:,和.组件负责呈现但以不同的方式做到这一点。的渲染函数静态声明在运行前,像这样:虽然处理接收和呈现在运行时动态地,像这样:{this.props.children}两者都是和有onClick听众改变他们的状态并在点击时重新呈现。我注意到点击时它和被重新渲染。但是当我点击,那么只有父代而不是重新渲染。是一个没有shouldComponentUpdate()的功能组件所以我不明白为什么它不重新渲染。有人可

javascript - react .js : Is it possible to convert a react component to HTML DOM's?

我正在开发一个基于map的应用程序,该应用程序使用GoogleMapAPI在React.js中创建标记及其信息窗口。infowindow.setContent()只接受String或HTML。我不可能传入String,因为我有一个button链接到另一个React组件中的特定方法(类似于:_this.props.addList(地点))。因此,我必须将参数作为HTMLDOM填充为以下代码行:vardiv=document.createElement('div');vartitle=document.createElement('h4');title.innerHTML=place.na

javascript - 在 Angular2 上向正文添加类

我有三个组成部分。它们是HomeComponent、SignInComponent和AppComponent。当应用程序打开时显示我的主页(HomeComponent)。我在登录页面打开时单击了“登录”按钮。我希望在打开它时将“登录页面”类添加到正文中。我该怎么做?//AppComponentimport{Component}from'@angular/core';@Component({moduleId:module.id,selector:'app',template:''})exportclassAppComponent{}//SignInComponentimport{Comp

javascript - React - 如何确定组件是否是无状态/功能性的?

我有函数式/无状态组件和继承自React.Component的组件:constComponent1=()=>(Hello)classComponent2extendsReact.Component{render(){return(Hello)}}如何确定组件是否是无状态的?有什么官方途径吗?isStateless(Component1)//trueisStateless(Component2)//false 最佳答案 你可以检查它的原型(prototype),例如:functionisStateless(Component){ret

javascript - Angular 2 Material : sidenav toggle from component

我在我的项目中以这种方式使用Angular2Materialsidenav:Close如何从我的组件调用start.toggle()而不是带有点击事件的元素?感谢阅读 最佳答案 你想在你的Controller中声明一个ViewChild来引用你组件中的MdSidenav,像这样://Sidemenu@ViewChild('start')sidenav:MdSidenav;其中start是您要引用的组件的名称,在本例中为sidenav。接下来,您可以在该sidenav上调用方法,例如在您的Controller函数中调用this.sid