如何在MaterialUI中选中“徽章”复选框?

时间:2018-10-23 15:47:03

标签: javascript reactjs material-ui

根据徽章https://material-ui.com/api/badge/的API,有一个道具 Partial Public Class NotesContact Inherits System.Web.UI.Page Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load Me.TextBox1.Text = Context.User.Identity.Name Me.Calendar1.SelectedDate = DateTime.Today If (Not IsPostBack) Then ViewState("RefUrl") = Request.UrlReferrer.ToString() End If End Sub Private Sub SAVE_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles SAVE.Click Dim MyConnection As SqlConnection Dim MyCommand As SqlCommand 'Create a connection to the SQL Server. MyConnection = New SqlConnection("server=**************************") MyCommand = New SqlCommand("myStoredProcedure", MyConnection) 'Set the command type as StoredProcedure. MyCommand.CommandType = CommandType.StoredProcedure MyCommand.Parameters.Add(New SqlParameter("@FACASSIGN", SqlDbType.VarChar, 200)) MyCommand.Parameters("@FACASSIGN").Value = Me.ddlFacultyAssign.SelectedItem.Text 'Open and execute the statement MyCommand.Connection.Open() MyCommand.ExecuteNonQuery() MyConnection.Close() 'Close the connection GridView1.DataBind() ,它使用字符串来使用DOM元素或组件。

在我的代码中

component

OR

<Badge color="primary" classes={{ badge: classes.badge }} component="checkbox">
  <Avatar className={classes.orangeAvatar}>AP</Avatar>
</Badge>

在两种情况下,我都不会获得复选框作为徽章。这该怎么做?

1 个答案:

答案 0 :(得分:0)

使用复选框组件。可以在未选中图标道具时使用组件,而在选中图标道具时则可以使用图标道具。

      <Checkbox
          icon={<Avatar className={classes.purpleAvatar}> AP</Avatar>}
          checkedIcon={<Avatar className={classes.orangeAvatar}> AP</Avatar>}
        />