테마
bm.do('board:createPost')
- 설정된 게시판에 글을 작성해요.
- 게시판(
BOARD)을 활용하면 폼(Form)을 만드는 용도로도 활용할 수 있어요. - 로그인된 회원인 경우에는 작성자 정보가 자동으로 입력되지만, 비회원이 글을 작성하려는 경우에는
userName,email,password필드를 통해 작성자 정보를 추가로 입력받아야 해요. - 글에 파일을 첨부하려는 경우
files필드에FileList를 넘겨 첨부할 수 있어요.- 파일은 최대 5개 첨부가 가능하고 각 10MB 제한이 있어요.
- 지원 확장자:
.jpg,.jpeg,.png,.svg,.webp,.gif,.mp4,.pdf,.docx,.hwp,.csv,.xlsx,.pptx,.psd,.ai,.zip
html
<data value="$customer" />
<template>
<form>
<!-- 카테고리가 있는 경우에만 카테고리 선택 UI 표시 -->
{{#if property.board.tags.length}}
<select name="tagId" {{#if (eq property.board.tagRequiredStatus "REQUIRED")}}required{{/if}}>
{{#each property.board.tags}}
<option value="{{id}}">{{name}}</option>
{{/each}}
</select>
{{/if}}
<input type="text" name="title" placeholder="제목" required />
<textarea name="contents" placeholder="내용" required></textarea>
<!-- 비회원인 경우에만 작성자 정보 입력 필드 표시 -->
{{#unless customer}}
<input type="text" name="userName" placeholder="이름" required />
<input type="email" name="email" placeholder="이메일" required />
<input type="password" name="password" placeholder="비밀번호" required />
{{/unless}}
<!-- 회원이거나 비회원 첨부가 허용된 경우에만 파일 첨부 UI 표시 -->
{{#if (or customer (eq property.board.guestAttachmentStatus "ENABLED"))}}
<input type="file" name="attachments" multiple />
{{/if}}
<button type="submit">등록</button>
</form>
</template>
<script>
const container = bm.container;
const context = bm.context;
container.addEventListener('submit', async (e) => {
e.preventDefault();
const form = e.target;
// BOARD 세팅을 통해 블록에 설정된 게시판 정보
const board = context.property.board;
// <data value="$customer"/> 를 통해 주입된 고객 정보 (로그인하지 않은 경우 null)
const customer = context.customer;
const params = {
boardId: board.id,
title: form.title.value,
contents: form.contents.value,
accessType: 'OPEN',
// 카테고리 선택 시에만 tagIds 포함
...(form.tagId?.value && { tagIds: [form.tagId.value] }),
// 비회원인 경우에만 작성자 정보 직접 입력
...(!customer && {
userName: form.userName.value,
email: form.email.value,
password: form.password.value,
}),
};
// 첨부 파일이 있는 경우에만 포함
if (form.attachments?.files.length > 0) {
params.files = form.attachments.files;
}
try {
await bm.do('board:createPost', { params });
bm.do('snackbar:open', { message: '폼이 제출되었어요.' });
} catch (err) {
bm.do('snackbar:open', { message: err.message });
}
}, true);
</script>회원/비회원을 지원하는 게시판 글 작성 예시
jsx
await bm.do('board:createPost', {
params: {
boardId: ..., // (필수) 작성 대상 게시판 ID
title: '...', // (필수) 글 제목
contents: '...', // (필수) 글 내용
accessType: '...', // (필수) 공개 여부 ('OPEN', 'SECRET')
tagIds: [1, 2, 3], // (조건부 필수) 태그 ID 목록. `tagRequiredStatus`가 'REQUIRED'인 경우 필수
// 비회원인 경우 필수 (회원인 경우 생략, 자동으로 작성자 정보 입력)
userName: '...', // (조건부 필수) 작성자 이름
email: '...', // (조건부 필수) 작성자 이메일
password: '...', // (조건부 필수) 글 비밀번호
// 비회원은 `guestAttachmentStatus`가 'ENABLED'인 경우에만 사용 가능
files: FileList // (선택) 첨부 파일 (FileList 객체)
}
})