how to clear client people picker

How to clear a client people picker

ClearClientPeoplePicker("ClientPeoplePicker_TopSpan");

function ClearClientPeoplePicker(controlId)
{
        //var fieldName = id + '_TopSpan';
        var peoplePickerDiv = $("[id$='" + controlId + "']");

        // Get the people picker object from the page.
        var peoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[peoplePickerDiv[0].id];

        var usersobject = peoplePicker.GetAllUserInfo();
        usersobject.forEach(function (index) {
            peoplePicker.DeleteProcessedUser(usersobject[index]);
        });
}

How to work on react component

How to use react component in spfx ?

1.      Add React Webpart

2.      Once your webpart is ready then open .tsx file from component folderand  Import react component reference  in your webpart

import {Label} from 'office-ui-fabric-react';

3.      We will add a Label component in render method to show a message on webpart.

public render(): React.ReactElement<IReactDemoProps> {

    return (

      <div className={ styles.reactDemo }>

        <div className={ styles.container }>

          <div className={ styles.row }>

            <div className={ styles.column }>

              <Label className={styles.title}>Welcome to react component</Label>

            </div>

          </div>

        </div>

      </div>

    );

  }

4.      Result  :è

jQuery datepicker in SPFX

npm install jquery@2 --save
npm install jqueryui --save

npm install @types/jquery@2 --save
npm install @types/jqueryui --save

import { SPComponentLoader } from '@microsoft/sp-loader';
import * as $  from 'jquery';
import 'jqueryui';

 <input type="text" id="txtDate" >

public constructor() {
    super();
    SPComponentLoader.loadCss('//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css');
  }

public BindDatePicker()
  {
    $("#txtDate").datepicker();
  }