# Examples

Drag and drop
Upload a .CSV or .TXT file containing hashed or raw emails.
OR
Select state:
NioFileChooser(
	v-model="file" 
	instructions="Upload a .CSV or .TXT file containing hashed or raw emails."
	actionLabel="Action Label"
	:state="downloaderState"
	successMsg="Your file contains 12,345 valid emailss and 0 errors."
	validationErrorMsg="Your file does not contain any valid emails."
	@changed="loadTextFromFile($event)" 
	:percentComplete="10" 
	:maxFileSize="1024*1024*100"
	:validateFn="() => true"
)
.select-state
	.nio-h4.text-primary-darker Select state: 
	.states
		NioButton(normal-secondary @click="setState('initial')") Initial
		NioButton(normal-secondary @click="setState('selected')") Selected
		NioButton(normal-secondary @click="setState('inProgress')") Working
		NioButton(normal-secondary @click="setState('success')") Success
		NioButton(normal-secondary @click="setState('error')") Error	
export default {
  data: () => ({
    downloaderState: 'initial',
    file: null
  }),
  methods: {
    setState(val) {
      this.downloaderState = val
    },
    resetDownloader() {
			this.downloaderState = 'initial'
    },
    loadTextFromFile(files) {
      console.log(files[0])
    },
    downloadFile() {
			// do something with file
    }
  }
}
Last Updated: 2/10/2021, 5:34:22 PM