Question

我正在使用此助手显示type TForm1 = class(TForm) CDS1: TClientDataSet; CDS1ID: TAutoIncField; DS1: TDataSource; DBNavigator1: TDBNavigator; CDS1Name: TStringField; CDS1Description: TStringField; cxGrid1Level1: TcxGridLevel; cxGrid1: TcxGrid; cxGrid1DBBandedTableView1: TcxGridDBBandedTableView; cxGrid1DBBandedTableView1ID: TcxGridDBBandedColumn; cxGrid1DBBandedTableView1Name: TcxGridDBBandedColumn; cxGrid1DBBandedTableView1Description: TcxGridDBBandedColumn; procedure FormCreate(Sender: TObject); private procedure CustomDrawCell( Sender: TcxCustomGridTableView; ACanvas: TcxCanvas; AViewInfo: TcxGridTableDataCellViewInfo; var ADone: Boolean); protected public end; var Form1: TForm1; [...] procedure TForm1.CustomDrawCell(Sender: TcxCustomGridTableView; ACanvas: TcxCanvas; AViewInfo: TcxGridTableDataCellViewInfo; var ADone: Boolean); var ACol : TcxGridDBBandedColumn; begin ACol := TcxGridDBBandedColumn(AViewInfo.Item); if ACol = cxGrid1DBBandedTableView1Name then ACanvas.Font.Style := ACanvas.Font.Style + [fsBold] else if ACol = cxGrid1DBBandedTableView1Description then ACanvas.Font.Style := ACanvas.Font.Style + [fsItalic]; end; procedure TForm1.FormCreate(Sender: TObject); var i : Integer; begin CDS1.CreateDataSet; CDS1.InsertRecord([1, 'Name1', 'Description1']); CDS1.InsertRecord([2, 'Name12', 'Description2']); CDS1.First; cxGrid1DBBandedTableView1ID.PropertiesClassName := 'TcxTextEditProperties'; cxGrid1DBBandedTableView1ID.OnCustomDrawCell := CustomDrawCell; cxGrid1DBBandedTableView1Name.PropertiesClassName := 'TcxTextEditProperties'; cxGrid1DBBandedTableView1Name.OnCustomDrawCell := CustomDrawCell; cxGrid1DBBandedTableView1Description.PropertiesClassName := 'TcxTextEditProperties'; cxGrid1DBBandedTableView1Description.OnCustomDrawCell := CustomDrawCell; end; end.组件

datepicker

我想将javascript值传递给<%= react_component "MyDatePicker", startDate: '', endDate: ''%>和startDate道具。有可能这样做吗？

Answer 1

我真的不知道你在这里想要做什么，但是如果你只是想从你的组件到你的轨道控制器获得道具的价值，请执行以下操作。您可以在react组件中设置props的状态，并在用户选择日期时发送ajax请求。

Answer 2

使用Pubsub解决了这个问题。我所做的是publish用户首先在javascript中选择的值。然后在响应父组件生命周期方法上订阅先前的published事件，并使用setState基于此更改state。

现在我在移动设备上，但是一旦我访问了电脑，我就会发布代码以便清晰。

<强>更新

使用pubsub很简单。首先，我们需要publish使用javascript

从任何地方获取所需内容

dates={some_value:value, another_value: value }
PubSub.publish(OFFLINE_BOOKING_DURATION, dates)

这里我只传递一个日期对象。你可以传递任何东西。然后在反应componentDidMount状态下，我订阅了这个

componentDidMount: function () {
    this.token = PubSub.subscribe(OFFLINE_BOOKING_DURATION, this.subscriber)
},

这里首先是我们期待的对象和回调

所以这里是回调函数，你可以做任何事情，比如ajax调用，设置状态或任何东西

subscriber: function (msg, data) {
 #this method gets called on receiving data
 #we can access the data we passed like this
data.some_value},

最后取消订阅组件unmounts

componentWillUnmount: function () {
        PubSub.unsubscribe(this.token)
    }

这就是我实现它的方式。我不再拥有代码，但我希望你明白这一点。

在使用react_rails时更改react_component中的props

2 个答案: